Question

当将道具传递给React组件时，我目前正在这样做：

<MyComponent 
    {...this.props}
    foo=foo
    bar=bar
/>

foo和bar是我知道MyComponent需要的道具。但是，在大多数情况下，MyComponent中还包含需要来自更高组件的道具的组件，因此我使用{...this.props}运算符向前传递它们。我应该这样做，还是应该列出MyComponent的子组件需要的道具？

Answer 1

你应该使用像Flux，Redux或Mobx这样的状态管理（我认为，根本没有使用Mobx）来解决将道具传递到多个级别而不需要中间组件的问题。

你应该只将正确需要的道具传递给孩子。我在github上读了一篇关于这篇文章的精彩帖子，但无法找到它。

当您的应用程序增长并且它真的滥用Es6传播语法运算符时，它很难管理（即它可以很容易地短期传递道具，但是从长远来看，你仍然有问题，你只是掩盖它）。不确定它是否会降低应用程序的速度，但如果改变了道具，它将再次重新渲染所有子组件。

例如，当使用Redux时，你可以＆＃34;连接＆＃34;组件到全局状态（想想数据库）并将它们作为道具传递给你想要的任何组件，并绕过必须将道具转发给子组件的组件。

一开始学习很难，但1000％值得学习。

Answer 2

您应该只传入所需的道具，或者实现仅传递所需道具的容器组件。或者，您可以在组件上实施shouldComponentUpdate。获得性能的最简单方法是仅传递所需的道具。