超出最大更新深度。当组件重复调用setState [duplicate]时会发生这种情况

Question

这个问题在这里已有答案：

• React: onClick handler is getting called on every render? 1回答

我想调用一个方法，但同时它给了我一个错误：

超出最大更新深度。当组件在componentWillUpdate或componentDidUpdate中重复调用setState时，可能会发生这种情况。 React限制嵌套更新的数量以防止无限循环。

功能声明

datahandler= (val1,val2) => {
    this.setState(
      {
        dataNew:
          this.state.dataNew=== {val1} ? {val2} : {val1}
      },
      () => {
        this.getNew();
      }
    );
  };

功能调用

<Table.HeaderCell onClick={this.datahandler('name asc','name desc')}>
  Click Me to Call
</Table.Headercell>

Answer 1

你直接在渲染上调用this.sortHandler，这将导致调用setState，这反过来导致一个新的渲染，并且无限循环继续。

您希望为onClick提供一个在发生click事件时应该调用的函数。

<Table.HeaderCell
  onClick={() => this.sortHandler("companyName asc", "companyName desc")}
>
  Click Me to Call
</Table.HeaderCell>