score:1

Accepted answer

i found the answer to my question. i need to use the nextprops argument and the method componentwillupdate instead of the componentdidupdate method.

// before
componentdidupdate() {
 this.updateamout();
}

// after
componentwillupdate(nextprops) {
  if (!_.isequal(this.props, nextprops)) {
    this.updateamout();
  }
}

score:6

each time you modify state in componentdidupdate, a re-render is thrown asynchronously. in your method updateamount, you are modifying the state. and you are calling that method in componentdidupdate, so you initiate an infinite loop of re-renders, so this endless loop created finally wastes the javascript memory.

the react cycle when updating the state is the following one. so you can easily understand why you enter into an endless loop. enter image description here


Related Query

More Query from same tag