当React

时间:2017-07-07 13:14:01

标签: reactjs

我在我的应用中实现了一些自动完成功能。当我有一个新文本时,我将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>
    )
  }
}

0 个答案:

没有答案