Redux 和一个 reducer 访问不同的 reducer,怎么样?
Redux and within a reducer accessing a different reducer, how?
所以,我有一个有多个 reducer 的应用,因此关联了多个 action creator。
有一段时间我的一个 reducer 更新了状态(因为编辑),因此,我必须确保其他 reducer 看到这个更新并相应地调整它们的状态。
将其想象成用户选择 "sneakers",并且此状态管理位于名为 productsReducer 的缩减器中。因此,当用户在应用程序流程中移动时,他们会获得与之关联的优惠券减少器......但用户可以随时 "edit",因此如果他们随后编辑 "sneakers" 并说,选择另一个生产者,我必须能够实时更改 couponsReducer,因为进度模式需要反映这一点。我可以通过流程转到优惠券页面来做到这一点,因为在那个页面上我只是协调 componentWillMount 上的数据...但问题是我有一个进度模式,在进入优惠券页面之前,用户可以打开进度模式...这里会出现不匹配...
长篇大论我知道,我只是想解释一下我的情况。
所以,我希望能够从 productsReducer 中调用 "other reducers" 或他们的动作创建者。
中间件在这里是否合适,我在其中嗅探某个 "action.type",如果我看到它,我可以派遣其他 action.type 或者有没有办法调用动作创建者来自 productsReducer?
导入:从“./couponsActions”导入 * 作为优惠券以及我需要的任何其他操作似乎不合适。
根据应用程序状态更新状态是一种反模式。解决方法更简单:
如果一个操作影响多个 reducer,请在相关的 reducer 中订阅该操作。
因此,当用户选择 sneakers
时,触发这些操作
{ type: 'item_select', payload: 'sneakers' }
然后在 couponsReducer
中,有这样的东西:
function (state = initialState, action) {
if (action.type == 'item_select') {
return { ...state, activeProduct: action.payload);}
}
return state;
}
您不希望级联更新,其中状态取决于其他状态的变化。您想要一个简单的调度架构,其中一个操作会同时影响所有内容。
在很多情况下,在多个 reducer 中处理相同的操作就足够了(这是官方推荐的 redux 处理方式)。所以总是先尝试那个解决方案。
在更复杂的情况下,您可以使用一些库。例如使用 redux-saga 你可以这样处理它:
function* watchItemSelect() {
while(true) {
// Wait for the action you are interested in
const action = yield take('ITEM_SELECT');
// Send another action
yield put({type: 'OTHER_ACTION'})
// The loop will now continue and wait until the next ITEM_SELECT action comes
}
}
还有其他库做同样的事情,但有一点不同。大部分灵感来自elm语言:
这个 repo 也有一些关于上述库中思想的信息:
所以,我有一个有多个 reducer 的应用,因此关联了多个 action creator。
有一段时间我的一个 reducer 更新了状态(因为编辑),因此,我必须确保其他 reducer 看到这个更新并相应地调整它们的状态。
将其想象成用户选择 "sneakers",并且此状态管理位于名为 productsReducer 的缩减器中。因此,当用户在应用程序流程中移动时,他们会获得与之关联的优惠券减少器......但用户可以随时 "edit",因此如果他们随后编辑 "sneakers" 并说,选择另一个生产者,我必须能够实时更改 couponsReducer,因为进度模式需要反映这一点。我可以通过流程转到优惠券页面来做到这一点,因为在那个页面上我只是协调 componentWillMount 上的数据...但问题是我有一个进度模式,在进入优惠券页面之前,用户可以打开进度模式...这里会出现不匹配...
长篇大论我知道,我只是想解释一下我的情况。
所以,我希望能够从 productsReducer 中调用 "other reducers" 或他们的动作创建者。
中间件在这里是否合适,我在其中嗅探某个 "action.type",如果我看到它,我可以派遣其他 action.type 或者有没有办法调用动作创建者来自 productsReducer?
导入:从“./couponsActions”导入 * 作为优惠券以及我需要的任何其他操作似乎不合适。
根据应用程序状态更新状态是一种反模式。解决方法更简单:
如果一个操作影响多个 reducer,请在相关的 reducer 中订阅该操作。
因此,当用户选择 sneakers
时,触发这些操作
{ type: 'item_select', payload: 'sneakers' }
然后在 couponsReducer
中,有这样的东西:
function (state = initialState, action) {
if (action.type == 'item_select') {
return { ...state, activeProduct: action.payload);}
}
return state;
}
您不希望级联更新,其中状态取决于其他状态的变化。您想要一个简单的调度架构,其中一个操作会同时影响所有内容。
在很多情况下,在多个 reducer 中处理相同的操作就足够了(这是官方推荐的 redux 处理方式)。所以总是先尝试那个解决方案。
在更复杂的情况下,您可以使用一些库。例如使用 redux-saga 你可以这样处理它:
function* watchItemSelect() {
while(true) {
// Wait for the action you are interested in
const action = yield take('ITEM_SELECT');
// Send another action
yield put({type: 'OTHER_ACTION'})
// The loop will now continue and wait until the next ITEM_SELECT action comes
}
}
还有其他库做同样的事情,但有一点不同。大部分灵感来自elm语言:
这个 repo 也有一些关于上述库中思想的信息: