willReceiveProps 和 shouldComponentUpdate

当父组件重新渲染的时候,会触发子组件componentWillReceivePropsshouldComponentUpdate两个方法的执行。
nextProps会以参数的形式传递给这两个方法,他们之间是否有什么区别与联系?

1
2
3
4
5
6
7
8
9
10
11
12
class Demo extends React.Component {
componentWillReceiveProps(nextProps) {
//
}
shouldComponentUpdate(nextProps, nextState){
//
return true
}
render() {
return null
}
}

执行顺序

  1. componentWillReceiveProps
  2. shouldComponentUpdate
  3. render

执行时机

  1. componentWillReceiveProps不关心返回值,一般在这里根据props来更新state
  2. shouldComponentUpdate无论前者返回什么都会被调用,在这里判断是否调用render

componentWillReceiveProps已经在React16.3+中被列为deprecate方法,不仅是这个,还包括 componentWillUpdatecomponentWillMount等方法。可以通过这里查看详情

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×