componentDidUpdate is the function calldeafter some values are updated in setState.
Advantages
- You can get th value after the update most safety.
- You can pick the value up before the update.
- It doesn’t make user unconfortable even if setState doesn’t have extra drawing in componentDidUpdate.
Basic Usage
componentDidUpdate(prevState) {
if (this.state.name !== prevState.name) {
console.log(“name is updated”)
}
Note
Basically, comparing the value before the update and the value after the update and adding some process is mainly used.
If you do not compare correctly, it occurs the infinity loop such as update-> setstate-> render-> update-> setstate-> render…
It is necessary to add processing by correctly comparing the values before the update with the values before the update.
summary
I think that you should implement componentDidUpdate when you want to add processing depending on the result after something is updated.
The usage is severe. If you implement it without thinking, it would be a loop or a bug.
At present, it is a compromise because this function can safely compare after the update.