React生命周期函数的使用场景

标签：false   ext   als   one   ==   rop   render   dom   his   

使用shouldComponentUpdate( ) 生命周期函数，减少render函数的执行，减少对未发生改变的DOM结点的重复渲染。

  shouldComponentUpdate(nextProps, nextState) {
    if(nextProps.content !== this.props.content) {
      return true
    }else {
      return false
    }
  }

render() {
    console.log('child render')
    const { content } = this.props
    return (
        <li onClick={this.handleClick}>
          { content }
          {/* { this.props.content } */}
        </li>
    )
  }

若从父组件传来的content内容未发生改变则返回false（此部分查看React中生命周期函数文章）

React生命周期函数的使用场景

标签：false   ext   als   one   ==   rop   render   dom   his   

原文地址：https://www.cnblogs.com/nayek/p/12364702.html