0

I want to invoke a method but in meantime it give me an error:

Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

Function Declaration

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

Function Calling

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

1 Answers1

5

You are invoking this.sortHandler directly on render, which will cause setState to be invoked, which in turn results in a new render, and the indefinite loop continues.

You want to give onClick a function that should be invoked when the click event occurs instead. 

<Table.HeaderCell
  onClick={() => this.sortHandler("companyName asc", "companyName desc")}
>
  Click Me to Call
</Table.HeaderCell>
Tholle
  • 108,070
  • 19
  • 198
  • 189