这是一个之前已经讨论过的主题,但我仍然没有找到我喜欢的答案,并且会喜欢一些建议 .
我有以下问题 . 我的应用程序包含一个名为 CREATE_RESPONSE
的操作,它会创建一个新的响应记录并将其推送到 responses
状态 . 当用户单击按钮时,将从我的组件调度此操作的操作创建者 .
onClick={() => {
this.props.createResponse();
}}
现在,在用户执行此操作后,我想为此新响应打开一个模态 . 此模式依赖于新的响应状态更改,因此必须在 createResponse
之后发生 .
对我来说最直观的解决方案是使用回调,但我相信这代表了Redux的反模式 .
另一种方法是监听响应状态更改,然后每当响应数量发生更改时调度操作(类似于订阅示例:http://redux.js.org/docs/api/Store.html#subscribe)
function responses(state) {
return state.responses.size
}
let currentValue
function handleChange() {
let previousValue = currentValue
currentValue = responses(store.getState())
if (previousValue !== currentValue) {
// Dispatch action here
}
}
store.subscribe(handleChange)
这里的问题是我们正在响应满足这种条件的所有状态变化 . 在我的应用中,这在页面加载时被错误地触发 .
所以我的问题归结为:为响应状态变化而派遣行动的最佳方式是什么?
编辑
以下是我的Modal和Response reducers的简化版本:
语气
const modalState = Immutable.Map({
isOpen: false,
view: null,
modalProps: {}
});
export const modal = (state = modalState, action) => {
switch (action.type) {
...
}
}
回应
const responseRecord = Immutable.Record({
id: null,
...
});
export const responses = (state = Immutable.List([]), action) => {
switch (action.type) {
case 'CREATE_RESPONSE':
newResponse = new responseRecord(...);
state = state.unshift(newResponse);
return state;
...
1 回答
您可以在模态减速器中为
CREATE_RESPONSE
设置一个案例 . 每个动作都会通过每个减速器运行 . 大多数情况下,它会很快达到默认值 . 但如果你想要,你可以听CREATE_RESPONSE
并将isOpen
设置为true .虽然我也不需要.660626 . 您可以将
newRecord
添加到全局状态,而不是isOpen
标志 . 将模态定义为:并且在模态调度关闭时执行的任何操作中清除
newRecord
. 可能有必要在responses
减速器中听取该动作,但这是合法的 .(我玩得有点快,因为
newRecord
不是布尔值 . 它应该可以工作,虽然你也可以强制它作为!!newRecord
的布尔值,或者直接检查是否为null)这应该解决在页面加载时打开它的问题 . Modal完全按照它应该做的:只要有新记录就打开,没有任何明确的命令 . 您只需让React管理其可见性 .