React.JS-单击事件由于服务调用而在状态更改中丢失

Question

点击“ 下一个”按钮时，我正在进行服务呼叫，这将更新商店，而我打算移动到下一页。但是发生的事情是重新渲染会导致点击事件丢失。

  

clientInfo.container.ts

const mapStateToProps = ({info}:State) => { 
     return {clientInfo}
}
const mapDispatchToProps = (dispatch) => {
  return {
   fetchData: () => {
     fetchClientInfo(dispatch); //Service call
   }
  }
}
export default connect(mapStateToProps, mapDispatchToProps)(ClientInformation)

  

clientInformation.tsx

 class ClientInfo extends React.Component<Props, {}> {
   constructor(props: Props) {
    super(props)
   }
   public render() {
       next: () => {
          this.props.fetchData(); //makes service call
          if (clientInfo) { // only if value is in store go to next page
            navigate({route: 'step3'}
          }
       }
   }
 }