当前位置: 首页 > 知识库问答 >
问题:

如何划分Redux减速器和动作创作者之间的逻辑?

易祯
2023-03-14

我有一些逻辑,我已经把它放进减速机里了,我在想,应该把它放进行动中,然后传下去?

把这类东西放在动作或减速器中是最佳实践吗?

这里的工作示例。

减速器代码

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
  }
}

共有3个答案

郎磊
2023-03-14

因此,最好使用一个静态类来处理在redux之外实例化redux操作的第一级入口点。

我认为保持商店和行动链的纯洁是有道理的。

起初,这可能看起来像是许多复制的代码,但当您开始基于条件进行调度或需要从多个地方进行调度时,它就会打开并变得有意义。

陶腾
2023-03-14

我的理解是,动作应该是简单的对象,包含两件事:(i)动作类型和(ii)改变了什么(即新数据)。

另一方面,reducer是纯函数,它将操作和以前的应用程序状态作为输入,并返回新的应用程序状态。他们如何做到这一点取决于你。您可以添加任何必要的逻辑,以结合以前的状态操作并返回新状态,只要您不在reducer函数之外修改数据。

具体到您的代码,我不确定deal()函数是否属于action或reducer。我认为更好的地方可能是某种事件处理程序(例如,onClick)。然后,您可以将deal call的结果作为操作传递给您的减速机。

后化
2023-03-14

你的减速机必须是纯的。目前它并不纯净。它调用deal(),调用依赖于数学的getRandom()。random(),因此不是纯粹的。

这种逻辑(“生成数据”,无论是随机化的还是来自用户输入的)应该在动作创建者中。动作创建者不需要纯粹,可以安全地使用Math.random()。这个操作创建者将返回一个操作,一个描述更改的对象:

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

减速器只需添加(或更换?)这是州内的数据。

一般来说,从一个动作对象开始。它应该以这样一种方式描述变化,即使用相同的操作对象和相同的前一个状态运行减速器应该返回相同的下一个状态。这就是为什么减速器不能包含Math.random()调用-它们会打破这种条件,因为它们每次都是随机的。你将无法测试你的减速器。

确定动作对象的外观后(例如,如上所述),可以编写动作创建者来生成它,并编写一个减缩器来将状态和动作转换为下一个状态。生成动作的逻辑驻留在动作创建者中,对其作出反应的逻辑驻留在减速器中,减速器必须是纯的。

最后,不要在州内使用类。它们不能按原样序列化。您不需要类。只需使用普通对象和数组。

 类似资料:
  • 问题内容: 我已经在减速器中添加了一些逻辑,我认为应该将其添加到Action中并传递下去? 最好的做法是将此类内容放入动作或减速器中吗? 这里的工作示例。 减速器代码: 问题答案: 减速器必须是纯净的。当前它不是纯净的。它调用依赖于哪个调用,因而不是纯粹的。 这种逻辑(无论是随机生成还是来自用户输入的“生成数据”)都应在动作创建者中使用。动作创建者并不一定要纯粹,并且可以放心使用。该动作创建者将返

  • 我对Redux有相当的了解。 我想知道的一件事是,在一个大型应用程序中,会有多个操作和减缩器。 我的问题是 > reducer中是否存在重复操作? 即使当我查看redux流时,我也不理解这些问题 请澄清我的困惑。

  • 我有一个逻辑问题,我是否应该对操作中的每个回调进行多个函数调用: 或者我可能想把这些调用转移到redux减速机中,然后从那里调用下一个函数? 第二种方法在我看来像是反模式,会产生意大利面条式的代码...也许我错了?

  • 作为挂钩新手,我正在转换一些具有多个状态属性的旧代码,在搜索如何减少最初设置的useState挂钩数量时,我遇到了这段代码(失去了链接)。以下useReducer钩子代码按预期工作。我想我知道state值是通过setState(dispatch)更新的,我想弄清楚的是reducer的第二个参数是如何使用spread语法在state和newState之间复制值的。我看到的所有示例都使用switch语

  • 我有下面的状态和减缩器,但它没有推入新的数组对象。 照片未被推送,但被覆盖