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

ish*_*ala 3 reactjs redux react-redux

我是 React 和 Redux 的新手,一直以来,我都将我所有的动作创建者和常量放在一个文件“../actions/index.js”中。当我开始时,这看起来不错,但现在,它变成了一大块不可读的代码。

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

import {sampleAction} from '../action/func1';
Run Code Online (Sandbox Code Playgroud)

或者有没有更好的方法来做到这一点?

对不起,如果这似乎是一个愚蠢的问题。我仍在尝试了解 React-Redux 应用程序中的最佳实践。

Mic*_*per 6

您仍然可以将其拆分,但index.js为简单起见使用export * from '...'语法保留。

动作/功能1.js:

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

export const action1 = () => {...}
export const action2 = () => {...}
Run Code Online (Sandbox Code Playgroud)

动作/功能2.js:

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

export const action3 = () => {...}
export const action4 = () => {...}
Run Code Online (Sandbox Code Playgroud)

动作/ index.js:

export * from './functionality1'
export * from './functionality2'
Run Code Online (Sandbox Code Playgroud)

然后你可以像这样导入任何你需要的东西:

import { action1, action4, ACTION_2, ACTION_3 } from './actions'
Run Code Online (Sandbox Code Playgroud)