我读到Redux Thunk是管理异步操作/请求的可靠方法。通过其他操作调度操作没有什么意义。
如何调度同步操作?我不确定 thunk 方法的性能问题,但我可以在其他动作创建者中调度动作而不在内部定义函数吗?
在我看来,对于这种需求来说,使用 redux thunk 是不必要的。
显示和隐藏通知确实似乎是笨蛋的一个很好的用例。
David 的回答描述了为响应某些事情而进行多次更新的"默认"方式:从不同的化简器处理它。大多数情况下,这是您想要做的。
有时(与通知一样)可能不方便。我在回答这个问题时描述了如何在调度一个或多个操作之间进行选择。
如果您决定调度多个操作,只需从组件中按顺序执行,要么使用 Redux Thunk。请注意,如果 Redux Thunk 对您来说很神秘,您应该在使用它之前了解它的真实含义。它仅在代码组织方面提供好处;实际上,这和自己连续跑dispatch()
两次没有什么不同。
也就是说,Redux Thunk调度多个操作如下所示:
function increment() {
return { type: 'INCREMENT' }
}
function incrementTwice() {
return dispatch => {
dispatch(increment())
dispatch(increment())
}
}
store.dispatch(increment())
incrementTwice()(store.dispatch) // doesn’t require redux-thunk but looks ugly
store.dispatch(incrementTwice()) // requires redux-thunk but looks nice
使用 Redux Thunk 不会有任何性能问题。这只是调用函数的一种好方法,您可以将dispatch
交给它,以便他们可以根据需要多次执行此操作。
将陈述更改的操作视为一对一是错误的。它们实际上是多对多的。请记住,所有操作都是在所有化简器上调用的。
例如,单个操作可能会触发多个状态更改:
function firstReducer(state, action) {
switch (action.type) {
case ACTION_X:
// handle action x
}
}
function secondReducer(state, action) {
switch (action.type) {
case ACTION_X:
// handle action x
}
}
function thirdReducer(state, action) {
switch (action.type) {
case ACTION_X:
// handle action x
}
}
相反,相同的状态更改可能由两个不同的操作导致。
function firstReducer(state, action) {
switch (action.type) {
case ACTION_X:
case ACTION_Y:
// handle action x and y in the same manner
}
}
以相同的方式处理两个操作似乎很奇怪,但这仅在单个化简器的上下文中。其他减速器可以自由地以不同的方式处理它们。
function secondReducer(state, action) {
switch (action.type) {
case ACTION_X:
// handle action x
case ACTION_Y:
// handle action y
}
}
function thirdReducer(state, action) {
switch (action.type) {
case ACTION_X:
// handle action x
default:
// ignore action y
}
}
在这种多对多关系中,根本不需要操作层次结构。如果操作创建者触发多个同步操作,则代码将变得更加复杂且难以推理。
如果这通过,那么是的,使用:
store.dispatch(action1, action2)
也许在 github +1