我在我的应用中实现了一些自动完成功能。当我有一个新文本时,我将http数据作为字符串[]。当我输入D DIOE并且DAKT被渲染为项目时。如果我进入DI那么,DIOE会重新渲染。这正是我想要防止的,因为如果项目消失并再次出现以眨眼,它看起来很难看。
如果只有一些项目发生变化,如何在我的上下文中阻止整个数组重新渲染?
渲染
...
<nav>
{similars && similars.map((val, index) => {
return <Similar key={`similar-${val}-link`} similar={val} className={index == this.state.currentSimilarIndex ? transactionStyle.active : ''} onClick={() => this.clickSimilar(val)} />
})}
</nav>
...
渲染项目
class Similar extends React.PureComponent<Similar.Props, Similar.State> {
render(): JSX.Element {
const { similar, className, onClick } = this.props
return (
<a key={`similar-${similar}-link`} className={className} onClick={onClick()} tabIndex={1}>
{similar}
</a>
)
}
}