react中避免重复渲染使用shouldComponentUpdate

shouldComponentUpdate钩子函数

• 组件更新机制：父组件更新会引起子组件也被更新
• 问题：子组件没有任何变化时也会重新渲染
• 如果避免不必要的重新渲染？
• 解决方式：使用钩子函数 shouldComponentUpdate(nextProps, nextState)
  • 在这个函数中，nextProps和nextState是最新的状态以及属性
• 作用：这个函数有返回值，如果返回true，代表需要重新渲染，如果返回false，代表不需要重新渲染
• 触发时机：更新阶段的钩子函数，组件重新渲染前执行(shouldComponentUpdate => render)

class Hello extnds React.Component{
shouldComponentUpdate(){
//根据条件决定是否渲染组件
return false
}
render(){.....}
}