将道具通过多个组件传递给孩子是不好的做法吗?

时间:2016-02-25 15:21:05

标签: reactjs

如果我将道具从根组件向下传递给子组件4-5组件,这是不好的做法/会不会影响性能?

我认为链中的每个组件都必须在每次道具更改时重新渲染,这意味着性能不佳,因为它只是一个实际需要更改的大型组件中的一个小子组件。

如果确实如此,我应该展平我的根组件,还是应该实现自定义'shouldComponentUpdate',还是其他什么?

3 个答案:

答案 0 :(得分:3)

实现shouldComponentUpdate是一种非常好的做法,可以最大限度地减少重新渲染,特别是如果组件保持简单和小,以便能够定义shouldComponentUpdate简单。

作为替代方案,请查看react-redux或其他状态容器,以便更轻松地管理状态。

答案 1 :(得分:1)

React不会重新呈现DOM,除非树实际上需要更新/更改,因此没有渲染性能成本。

您还可以使用shouldComponentUpdate()来管理对每个组件的更新。

Facebook's React Reconciliation

shouldComponentUpdate

答案 2 :(得分:1)

需求应该很少,但React的差异算法将确保除非必要,否则不会进行任何更新。表现不应该受到影响。

例如,我通常使用容器类启动我的应用程序,该容器类执行媒体查询(使用react-responsive)。使用此媒体查询,我将display="desktop"display="mobile"传递给下一个组件。我通常将this.props.display一直传递到我的组件树中,这是我的CSS看起来(桌面视图或移动视图)的决定因素。在这种情况下,性能实际上得到了提升!