问题:Redux 动作依赖/耦合到其他动作

我正在构建一个 Redux 应用程序(我的第一个),并且有点不清楚动作之间的耦合程度。

我的应用程序有几种形式,其值在 url 中序列化。

例如,有一个特定搜索的输入字段,并且在键入时更新 url 参数。还有几个其他输入字段遵循此模式。

在我的顶级index.js中,我有几个如下所示的代码块:

// Within the declaration of a high-level component
onForm1Change={(key, value) => {
        // Listened to by "formValues" state cross-section reducer
        store.dispatch({
            type: actions.FORM1_CHANGE,
            key: key,
            value: value
        });

        // Listened to by "url" state cross-section reducer, leads to a url param update.
        // Has it's own logic that is based upon the formValues state.
        // Must run after FORM1_CHANGE finishes
        store.dispatch({
            type: actions.UPDATE_URL,
            formValues: store.getState().formValues
        });
    }
}

UPDATE_URL这样的操作感觉不太对劲。这个动作不是独立存在的......它依赖于首先调度的其他动作。

动作之间的这种耦合是代码味道吗?是否有任何常用技术来解耦/重构这些操作?

解答

我认为这完全可以链接同步操作。你也可以使用像redux-thunk这样的中间件来使它更容易阅读(因为你会将你的动作调度器函数存储为动作创建者)。这是关于这个主题的一些文章。

Logo

React社区为您提供最前沿的新闻资讯和知识内容

更多推荐