将道具作为{... props}而不是myProp = {value}给予组件是否可以重新渲染该组件？

Question

如果我给一些组件道具，例如：

<MyComponent {...props} />

代替

<MyComponent myProp={value} />

道具可能具有此组件不使用的某些属性。

组件如何知道哪些道具已更改，以及是否仅应根据使用的道具重新渲染？一点都不知道吗？

Answer 1

如果组件的状态或父组件的prop被更改/更新，则会重新渲染。

因此，假设在...props后面有一个属性对象，好像其中一个属性被更改了，由于只有一个属性更改，整个组件将重新呈现

重新渲染

let obj = {
  a : some value,
  b : some value, // gets changed
}
<Component {...obj} />

虽然仅提供一个值给prop，但如果该值被更改，组件将根据该单例更改重新呈现。

不重新渲染

let obj = {
  a : some value,
  b : some value, // gets changed
}
<Component myProp = {obj.a} />

因此，正如Paul Habfast在回答中说的那样，即使b中的obj未用于组件中，其值的更改也会触发重新渲染，因为我们将所有属性都发送为{{ 1}}表单。

注意：假设此...props就像一组属性，它可能包含组件的状态属性或任何常量/原始/非原始数据类型值

Answer 2

默认情况下，React.Component会在其父组件重新投放时重新投放。

如果React.PureComponent的任何道具或状态的任何成员发生变化，则会重新呈现。

功能组件是简化的PureComponent，没有任何状态，因此，如果其任何道具更改，都将重新呈现。

要直接回答您的问题，可以：如果您使用

<MyComponent {...props} />

然后，props的任何成员中的任何更改都会触发重新呈现，即使MyComponent不使用它也是如此。