我有一些逻辑,我已经把它放在reducer中,我认为应该把它放在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 } }
Dan Abramov.. 63
你的减速机必须是纯净的.目前它并不纯粹.它调用依赖于deal()
哪些调用getRandom()
而Math.random()
不是纯粹的调用.
这种逻辑("生成数据",无论是随机的还是来自用户输入的)应该在动作创建者中.动作创作者不需要是纯粹的,并且可以安全地使用Math.random()
.此操作创建者将返回一个操作,一个描述更改的对象:
{ type: 'DEAL_CARDS', cards: ['heart', 'club', 'heart', 'heart'] }
reducer只是在状态中添加(或替换?)这些数据.
通常,从操作对象开始.它应该以这样的方式描述更改,即使用相同的操作对象和相同的先前状态运行reducer应该返回相同的下一个状态.这就是减速器不能包含Math.random()
调用的原因 - 它们会破坏这种情况,因为它们每次都是随机的.你将无法测试你的减速机.
在弄清楚动作对象的外观(例如上面的内容)之后,您可以编写动作创建器来生成它,并使用减速器将状态和动作转换为下一个状态.生成动作的逻辑驻留在动作创建者中,对其作出反应的逻辑驻留在reducer中,reducer必须是纯粹的.
最后,不要在州内使用类.它们不是可序列化的.你不需要Card
上课.只需使用普通对象和数组.
你的减速机必须是纯净的.目前它并不纯粹.它调用依赖于deal()
哪些调用getRandom()
而Math.random()
不是纯粹的调用.
这种逻辑("生成数据",无论是随机的还是来自用户输入的)应该在动作创建者中.动作创作者不需要是纯粹的,并且可以安全地使用Math.random()
.此操作创建者将返回一个操作,一个描述更改的对象:
{ type: 'DEAL_CARDS', cards: ['heart', 'club', 'heart', 'heart'] }
reducer只是在状态中添加(或替换?)这些数据.
通常,从操作对象开始.它应该以这样的方式描述更改,即使用相同的操作对象和相同的先前状态运行reducer应该返回相同的下一个状态.这就是减速器不能包含Math.random()
调用的原因 - 它们会破坏这种情况,因为它们每次都是随机的.你将无法测试你的减速机.
在弄清楚动作对象的外观(例如上面的内容)之后,您可以编写动作创建器来生成它,并使用减速器将状态和动作转换为下一个状态.生成动作的逻辑驻留在动作创建者中,对其作出反应的逻辑驻留在reducer中,reducer必须是纯粹的.
最后,不要在州内使用类.它们不是可序列化的.你不需要Card
上课.只需使用普通对象和数组.