我是Redux的新手,立刻引起我注意的是Reducers打开了类型。
function counter(state, action) {
if (typeof state === 'undefined') {
return 0
}
switch (action.type) {
case 'INCREMENT':
return state + 1
case 'DECREMENT':
return state - 1
default:
return state
}
}
// details omitted
document.getElementById('increment')
.addEventListener('click', function () {
store.dispatch({ type: 'INCREMENT' })
})
document.getElementById('decrement')
.addEventListener('click', function () {
store.dispatch({ type: 'DECREMENT' })
})
为什么不使用这样的东西?
function increment(state) { return state + 1; }
function decrement(state) { return state - 1; }
function counter(state, action) {
if (typeof state === 'undefined') {
return 0
}
return action.handler(state);
}
// details omitted
document.getElementById('increment')
.addEventListener('click', function () {
store.dispatch({ handler: increment, type: 'unused' })
})
document.getElementById('decrement')
.addEventListener('click', function () {
store.dispatch({ handler: decrement, type: 'unused' })
})
答案 0 :(得分:5)
因此,您不希望将其置于操作中的重要原因是您商店中的多个节点可能想要响应相同的操作。
dispatch({ type: "USER_LOGIN", payload: user });
这可能让user
想要对操作作出反应,它可能希望标题/登录/注销功能做出反应,它可能希望您所依赖的页面作出反应,或访问 - 反应水平。
如果您将数据的行为与页面的行为联系起来,那么您已经删除了这种能力,并且有点否定了两者之间的分离。
绝对没有理由不使用策略模式(而不是开关)并在那里使用你的功能。
function (state, action) {
const strategy = {
INCREMENT: increment,
DECREMENT: decrement,
default: identity
};
return (strategy[action.type] || strategy.default)(state, action);
}
increment
等函数将在进一步缩放的节点上进行状态和操作。
答案 1 :(得分:2)
根据redux docs:
操作是纯JavaScript对象。动作必须具有类型 指示正在执行的操作类型的属性。类型 通常应该定义为字符串常量。
Redux使用POJO实现command pattern,因为它们可以被序列化记录并重放。使用此模式,您可以记录一系列操作,然后将状态重播(缩小)回到您希望的位置,并在redux中启用hot reloading with Time travel。
这是使用redux命令模式轻松实现撤消/重做的great example。
相比之下,你所建议的回调不能被序列化和记录,这违背了redux的最初目的。