从子组件执行父函数不会产生正确的结果：React + Typescript

Question

I am trying to execute the parent function by calling it from child component and it does not yield proper results. There is a Pagination Component that computes the offsets for the pagination and sends the data to the child by calling parents method.

Console log statement inside Parent gives wrong result where as inside child's setOffSet() gives proper result and when sent to parent component's method in the next line, It gives wrong result.

Code Sandbox: https://codesandbox.io/s/react-typescript-v91un

Answer 1

setState needs a callback function but you're immediately calling the handlePagination function so you'd be passing in the return value of handlePagination. Try this instead...

this.setState(
      { fromIndex },
      () => this.props.handlePagination(this.state.fromIndex, NO_OF_RECORDS_PER_PAGE)
    );