javascript – ReactJS – 防止重新渲染子项

2023年4月3日 200次阅读

我有一个带有3个孩子的父React组件,如下所示：

var Parent = React.createClass({
   render: function() {
     return (<div>
         <C1/>
         <C2/>
         <C3/>
       </div>)
   }
})

我试图能够根据当前的父状态改变孩子的位置.所以在不同情况下我需要返回C1,C3,C2或C3,C2,C1等.
但我想要这样做而不重新渲染孩子.
我试图在每个子节点上使用shouldComponentUpdate,但是调用它的组件不会改变它们在父级的render方法中的位置.
因此,如果最初返回C1,C2,C3然后返回C2,C1,C3,那么应该为C3调用shouldComponentUpdate而不是C1或C2,所以在这种情况下我可以在C3内返回false并防止重新渲染,但我不明白为什么shouldComponentUpdate并没有要求改变其立场的孩子.

有什么建议？谢谢.

最佳答案 看看
http://facebook.github.io/react/docs/create-fragment.html.

设计了键控片段以解决这些问题;)

点赞