商店更改后如何忽略重新渲染？答案

【问题标题】：How to ignore re-render after store changes?商店更改后如何忽略重新渲染？
【发布时间】：2017-07-04 21:41:14
【问题描述】：

如果商店的某些部分发生更改，我有一些组件我完全想忽略重新渲染（或对这些组件的任何其他更改）。如何做到这一点？

【问题讨论】：

【解决方案1】：

将 shouldComponentUpdate 函数添加到该组件并返回 false。

shouldComponentUpdate() {
   return false;
}

【讨论】：

【解决方案2】：

为了忽略对组件的更新，您应该使用shouldComponentUpdate 生命周期方法。这应该在您的组件类中实现并始终返回 false。这是一个例子：

class CustomComponent extends React.Component {
  shouldComponentUpdate() {
    return false;
  }

  render() {
    /* ... */
  }
}

希望这会有所帮助！

【讨论】：

【解决方案3】：

shouldComponentUpdate(nextProps, nextState) {
   if ('not rerender condition') {
     return false;
   } else {
     return true
   }
}

【讨论】：

【解决方案4】：

除了shouldComponentUpdate，你可以尝试使用组件的key属性来停止重新渲染。如果预览 key 与下一个 key 相同，React 不会重新渲染这个组件。

【讨论】：

你能举个例子吗？
Keys should be stable, predictable, and unique. Unstable keys (like those produced by Math.random()) will cause many component instances and DOM nodes to be unnecessarily recreated, which can cause performance degradation and lost state in child components. 来自here。在某些情况下，例如多个嵌套组件，它可以工作！