Javascript 将我的所有操作注入组件是否有任何问题？

我已将我的操作设置到组件中，如下所示：

import { funcionA, functionB, functionC } from '../actions'

actionIndex.js

import { bindActionCreators } from 'redux'
import * as profileActions from './profileActions'
import * as uiActions from './uiActions'
import * as statusActions from './statusActions'
import * as searchActions from './searchActions'
import * as filterActions from './filterActions'


export default function bindActions(dispatch) {
  return (
    bindActionCreators({
      ...profileActions,
      ...uiActions,
      ...statusActions,
      ...filterActions,
      ...searchActions}, dispatch)
  )
}

SomeComponent.jsx

import React from 'react'
import { connect } from 'react-redux'
import actions from '../../actions/actionIndex'

@connect(
  store => {return {...store}},
  dispatch => ({actions : actions(dispatch) })
)
export default class SomeComponent extends React.Component{

---

我正处于原型阶段，所以我一直在尝试设置一些东西，这样我就可以在不处理大量样板文件的情况下尽快工作。现在我知道将所有存储数据传递给每个组件是不好的，因为它会导致大量不必要的重新渲染。将所有操作传递给与上述类似的组件是否有问题？这使我可以通过在组件中使用

This.props.actions.someActions（）

调用任何定义的操作，这非常简单，但是是否存在任何重大的性能权衡？到目前为止，我还没有注意到任何问题，但我很好奇是否有人对react和redux有更深入的了解。如果将来它不会把事情搞得一团糟的话，我愿意继续使用这种方法。

我会把状态/行为分割成他们的财产。例如，如果你想开发一个购物车，你可以用

和

和

来包装所有东西

<App>          <--- Inject products && cart state + actions here?? 
 <Products />  <--- Inject products state + cartActions Here
 <Cart />      <--- Inject cart state + cart Actions Here
</App>

哪一个更容易？有几个挫折

如果

购物车

状态已更新，

将重新呈现。重新渲染

+

不仅仅是

考虑让25个组件从

中下来，这是您非常希望避免的事情，25个不必要的重新渲染

理想情况下，应执行以下操作：

import { funcionA, functionB, functionC } from '../actions'

仅绑定组件将使用的函数。并分别连接每个容器的状态部件，仅连接使用的状态部件。。

---

这取决于你在建设什么。

我理解与国家的权衡，我在帖子中也提到了这一点。我的示例显示了传递所有状态，因为在原型化组件时，我就是这样做的。我把它清理干净，当我不再胡闹的时候，只通过需要的状态。我的问题是关于将所有操作传递给组件的。将所有操作传递到

root

组件中应该不会有任何问题，只要您能够轻松地进行管理。这似乎容易多了！虽然你实际上分享了我没有考虑的东西。这是一个子组件。如果我将相同的mapDispatchToProps放在根应用程序组件上，它会级联到所有子组件吗？虽然这似乎不是一个好主意，但如果可能的话，它会很有趣。@DigitalDisaster它将作为

this.props.actions

提供，然后您可以将它传递给孩子们