如何在Redux reducer和动作创建者之间划分逻辑？

Question

我已经在减速器中添加了一些逻辑，我认为应该将其添加到Action中并传递下去？

最好的做法是将此类内容放入动作或减速器中吗？

这里的工作示例。

减速器代码：

function Card() {
  this.card = (Math.random()*4).toFixed(0);
}

Card.prototype = {
  getRandom: function(){
    var card;
    //console.log(this.card)
    switch (this.card) {
      case '1':
      card = 'heart';
      break;
      case '2':
      //card = 'diamonds';
      card = 'heart'; // weight the odds abit
      break;
      case '3':
      card = 'club';
      break;
      case '4':
      card = 'spade';
      break;
      default:
      card = 'heart';
      break;
    }
    return card;
  }
}

var dealer = {
  deal: function(){
    var results = [];
    for(var i = 0; i <4; i++){
      var card = new Card();
      results.push(card.getRandom());
    }
    console.log(results);
    return results;
  }
}


const initialState = {
  count: 0,
  data: []
}

function counter (state = initialState, action) {
  let count = state.count
  switch (action.type) {
    case 'increase':
      return Object.assign({}, state, {
        data: dealer.deal(),
        count: state.count+1
      })
    default:
      return state
  }
}

Answer 1

减速器必须是纯净的。当前它不是纯净的。它调用依赖于deal()哪个调用getRandom()，Math.random()因而不是纯粹的。

这种逻辑（无论是随机生成还是来自用户输入的“生成数据”）都应在动作创建者中使用。动作创建者并不一定要纯粹，并且可以放心使用Math.random()。该动作创建者将返回一个动作，
一个描述更改的对象 ：

{
  type: 'DEAL_CARDS',
  cards: ['heart', 'club', 'heart', 'heart']
}

reducer只会在状态内部添加（或替换？）此数据。

通常， 从动作对象开始。
它应该以这样的方式描述更改：使用相同的操作对象和相同的先前状态运行化简器应返回相同的下一状态。这就是为什么reducer不能包含Math.random()调用的原因，因为每次调用都是随机的，它们会破坏该条件。您将无法测试减速器。

确定动作对象的外观后（例如，如上），您可以编写动作创建器来生成它，并编写一个reducer来将状态和动作转换为下一个状态。
生成动作的逻辑驻留在动作创建者中，对其做出反应的逻辑驻留在reducer中，reducer必须是纯函数。

最后， 不要在state中使用类 。它们不能直接序列化。你不需要Card上课。只需使用普通对象和数组即可。