可以在所有容器组件中导入所有动作创建者吗？

Posted 2023-02-22

【中文标题】可以在所有容器组件中导入所有动作创建者吗？

【英文标题】：It's ok to import all action creators in all container components?

【发布时间】：2017-01-01 01:16:40

【问题描述】：

我知道我有一个索引文件，我在其中导入不同的文件，其中包含不同视图的动作创建者：

import generalActions from './generalActions'
import vftActions from './vftActions'
import shareActions from './shareActions'
import codeFormActions from './codeFormActions'
import signupActions from './signupActions'

const actions = 
    ...generalActions,
    ...vftActions,
    ...shareActions,
    ...codeFormActions,
    ...signupActions


export default actions

然后我每次都导入所有动作的动作索引：

import  connect  from 'react-redux'
import  bindActionCreators  from 'redux'
import actions from '../../redux/actions'

function mapDispatchToProps(dispatch) 
    return 
        actions: bindActionCreators(actions, dispatch)
    


export default connect(null, mapDispatchToProps)(ContainerComponent)

如果我将它分离到不同的导出中并只导入我的容器需要的动作创建者，可以吗？

此外，当我有很多动作创建者时，很可能很难找到没有使用的名称。

你认为最好的方法是什么？

【参考方案1】：

我认为更好的解决方案是分别导出每个动作模块。 我在我的项目中使用下一个架构：

所有动作的索引文件actions/index.js:

// just import actions from other files (modules)
import * as notification from './notification'
import * as friend from './friend'
import * as profile from './profile'

// export all actions as modules
export  notification 
export  friend 
export  profile 

之后，在我的容器中，我只从actions/index.js 导入我需要的内容：

import  notification,
         profile  from '../actions'

通过这种方法，您将完全控制您需要对容器执行哪些操作。

【参考方案2】：

仅导入您需要的操作是执行此操作的常用方法。我不明白您为什么需要将所有操作捆绑在一个对象中。

你也可以像这样使用命名空间导入：

import * as generalActions from './generalActions'

在这种情况下，您不需要 export default 包含所有 generalActions 的操作对象，您只需 export 每个操作即可。

一般来说，最好只导入您实际使用的内容。

【讨论】：

"一般来说，最好只导入您实际使用的内容。"这是为什么？这正是被问到的问题，因此详细说明这些良好做法会很有帮助:-)