如何在 react-redux 应用程序中安排动作创建者？

Question

我是 React 和 Redux 的新手，一直以来，我都将我所有的 action creators 和我的常量放入一个文件“../actions/index.js”。当我开始时，这看起来不错，但现在，它变成了一大堆不可读的代码。

您是否建议将 index.js 分解为 functionality1.js、func2.js、func3.js，然后根据需要从拆分文件中导入操作：

import {sampleAction} from '../action/func1';

或者有更好的方法吗？

抱歉，如果这个问题看起来很愚蠢。我仍在尝试了解 React-Redux 应用程序中的最佳实践。

Answer 1

您仍然可以拆分它，但为了简单起见，使用语法保留 index.js。

actions/functionality1.js:

export const ACTION_1 = '...'
export const ACTION_2 = '...'

export const action1 = () => {...}
export const action2 = () => {...}

actions/functionality2.js:

export const ACTION_3 = '...'
export const ACTION_4 = '...'

export const action3 = () => {...}
export const action4 = () => {...}

actions/index.js:

export * from './functionality1'
export * from './functionality2'

然后你可以像这样导入任何你需要的：

import { action1, action4, ACTION_2, ACTION_3 } from './actions'

How to arrange action creators in a react-redux application?