javascript - React 调用函数在循环中重新启动

Question

我试图理解为什么这会导致循环:

<button onClick={this.moveRight()}>

但这并不:

<button onClick={this.moveRight}>

另外，我的问题是从另一个函数调用一个函数，这也会导致循环，为什么？

anyfunction(){
anotherfunction();
}

anotherfunction(){

        if (this.state.something >1 ){
            this.setState(PrevState => {
                PrevState.something = PrevState.something -1
                return {something = PrevState.something};
            });
            this.anyfunction()

        }
    }

为什么 if 不打破循环？

Answer 1

如果 this.moveRight() 调用自身，那么除非您设置一个条件来停止递归，否则它将继续这样做。另外，这个answer告诉您如何正确分配事件处理程序。

Also my problem is to call a function from another function. That is also resulting a loop, why?

this.setState 是异步的，因此如果您希望在调用 this.anyfunction()< 之前设置 this.state.something 的值，那么你需要执行以下操作:

function anotherfunction() {
  if (this.state.something > 1) {
    this.setState(
      PrevState => {
        return { something: PrevState.something - 1 };
      },
      () => {
        this.anyfunction();
      }
    );
  }
}

其中表示，一旦完成我要求的状态更改，就调用 this.anyFunction 。更多信息here .