一面（3） react方面

时间：2021-09-23 02:12:20

1.react的声明周期

  • getDefaultProps()
  • getInitialState()
  • componentWillMount()       以后组件更新不调用， 只调用一次             能更改state。
  • render()                              创建虚拟dom，进行diff算法，更新dom树都在此进行    不能更改state
  • componentDidMount()       组件渲染之后调用，只调用一次。  获取页面的初始数据 页面加载的时候请求数据
  • componentWillReceiveProps(nextProps)   组件初始化时不调用，组件接受新的props时调用。
  • shouldComponentUpdate(nextProps, nextState)   react性能优化非常重要的一环。组件接受新的state或者props时调用，我们可以设置在此对比前后两个props和state是否相同，如果相同则返回false阻止更新
  • componentWillUpdata(nextProps, nextState)  组件初始化时不调用，只有在组件将要更新时才调用，可以修改state
  • render()
  • componentDidUpdate()   组件更新完成后调用，此时可以获取dom节点。
  • componentWillUnmount()   组件将要卸载时调用，一些事件监听和定时器需要在此时清除。

2.父子之间的通信

父传子        父传递     <child   name={ this.state.name}>     子接收   <div>{this.props.name}</div>

子传父       通常通过调用父亲的函数来更改值

父传子一个方法   <Child   handleChange = {this.handleChange}> 这个方法是setstate父亲的数据的

子在需要操作的时候调用这个方法  this.props.handleChange(存在父组件的数据)

3.方法中this指向问题

在constructor中bind（this）或者直接用箭头函数

4.兄弟之间传递

redux     store  reduce

react-redux

相关文章