I'm trying to update a child ponent as soon as it recieves new props. However, ponentWillReceiveProps() in my child ponent is called before the props have actually updated. After reading this article i do understand why but it doesn't explain me how to solve my problem.

How do i call ponentWillReceiveProps() after the props have updated?

Right now i'm cheating my way around it by letting a timeout run which waits for the actual update, but i really don't like this solution.

  ponentWillReceiveProps(){
   var timeOut = setTimeout(() => this.loadPosts(), 100)
  },

Thanks id advance!

I'm trying to update a child ponent as soon as it recieves new props. However, ponentWillReceiveProps() in my child ponent is called before the props have actually updated. After reading this article i do understand why but it doesn't explain me how to solve my problem.

How do i call ponentWillReceiveProps() after the props have updated?

Right now i'm cheating my way around it by letting a timeout run which waits for the actual update, but i really don't like this solution.

  ponentWillReceiveProps(){
   var timeOut = setTimeout(() => this.loadPosts(), 100)
  },

Thanks id advance!

• javascript
• reactjs

• just pass prop to child ponent inside render. – Khalid Azam Commented Jan 4, 2017 at 7:41

2 Answers 2

Is it necessary to call ponentWillReceiveProps after the props have updated? Or can you use the nextProps argument?

Eg. if you rewrite as:

ponentWillReceiveProps(nextProps){
  this.loadPosts(nextProps)
},

and then of course also rewrite the signature of loadPosts to allow manually passing in props:

loadPosts(props = this.props){
  // do something with props
  ...
}

Use ponentDidUpdate(prevProps, prevState). When it's called, two arguments are passed: prevProps and prevState. This is the inverse of ponentWillUpdate. The passed values are what the values were, and this.props and this.state are the current values.