我在优化部分上工作,发现,节列表正在渲染子组件,即使它们没有变化。在研究中,我发现您必须传递一个唯一标识一个部分的密钥,以避免重新呈现子组件。
我确实将唯一键传递给了子组件,但是甚至没有重新呈现它。
更新:下面的代码
我正在使用react-redux进行状态管理。
渲染:
<SectionList
renderItem={this.renderItem}
renderSectionHeader={this.renderSectionHeader}
sections={this.getSectionListData()}
keyExtractor={(item, index) => item + index}
/>
renderItem:
if (conditionX)
return <XComponent data={this.getDataX()} action={this.doSomethingToX} />
else if (conditionY)
return <YComponent data={this.getDataY()} action={this.doSomethingToY} />
else if (conditionZ)
return <ZComponent data={this.getDataZ()} action={this.doSomethingToZ} />
else
return <View/>
getDataX = () => return this.props.reduxState.dataX;
getDataY = () => return this.props.reduxState.dataY;
getDataZ = () => return this.props.reduxState.dataZ;
doSomethingToX/Y/Z : Updates the reducer values X/Y/Z respectively.
最初,Reducer中没有X / Y / Z的任何值,但是如果更新值X,子组件(即YComponent
,ZComponent
)也将重新呈现
关于如何避免这种不必要的渲染的任何建议。