反应最佳实践:将状态传递给孩子或直接进行子女检查?

时间:2018-06-12 14:23:48

标签: javascript reactjs redux

我正在使用react / redux。我有一个程序有两个组件,称为foo和bar。 Foo需要设置bar将用于决定如何渲染的状态。我有foo使用调度程序来调度一个动作,而reducer正在使用动作来设置全局状态,到目前为止一切都很好。

我的问题是谁应该加载它。让我的索引(渲染foo和bar)检查状态然后将状态值作为prop传递给bar,或者让bar切掉中间人并直接检查状态是不是更好。

更确切地说,我想知道react / redux的开发人员是否支持一种特定的方法,或者这是否是那些只要开发人员保持一致的任何一种方法都可行的设计决策之一?

1 个答案:

答案 0 :(得分:1)

使用redux和react时的一个主要建议是牢记演示和容器组件模式,在这种模式中,我们的表示组件不知道redux的存在并从中接收数据道具,而容器组件是订阅状态并将其传递给表示组件的人:

在这里你有一个演示组件,因为你可以看到它与反应无关。

const TodoList = ({ todos, onTodoClick }) => (
  <ul>
    {todos.map((todo, index) => (
      <Todo key={index} {...todo} onClick={() => onTodoClick(index)} />
    ))}
  </ul>
)

为了拥有一个容器组件,我们会connect该组件并订阅它的反应状态,如:

const VisibleTodoList = connect(
  mapStateToProps,
  mapDispatchToProps
)(TodoList)

您可以获得更多信息here