跳至内容

react_perf/jsx-no-new-array-as-prop 性能

其作用

防止局部于当前方法的数组用于 JSX 属性的值。

这样做有什么不好?

将本地定义的数组用作属性的值会导致无意的重新渲染和性能问题。每当父组件渲染时,就会创建一个数组的新实例,导致子组件不必要地重新渲染。由于组件的属性未始终如一地传递,这也导致代码更难维护。

示例

此规则的错误代码示例

jsx
<Item list={[]} />
<Item list={new Array()} />
<Item list={Array()} />
<Item list={this.props.list || []} />
<Item list={this.props.list ? this.props.list : []} />

此规则的正确代码示例

jsx
<Item list={this.props.list} />

参考

根据 MIT 许可证发布。