javascript - 如何在 setState 回调的回调中进行 axios 调用

Question

我有两个异步调用，如下所示。我尝试将 axios 调用包装在 this.setState 的回调中，但它会抛出语法错误，如 ,预期

      this.setState(prevState => ({ 
          condition: [...prevState.condition, { name: "readByGroup", operator: "IN  ", value: groups }]
        }))
      }

        this.props.getMetricsByContent(this.state.condition).then((data) => {
          this.setState({isLoader: false});
          if(data && Array.isArray(data) && data.length > 0){
            let csvContent = papa.unparse(data);
            this.download(csvContent, 'metrics.csv', 'text/csv;encoding:utf-8');
            this.setState({statusMsg: "File Downloaded successfully"})
          } else this.setState({statusMsg: "No records to download"})
        })

我尝试过的内容如下:

this.setState(prevState => ({ 
      condition: [...prevState.condition, { name: "readByGroup", operator: "IN  ", value: groups }]

      this.props.getMetricsByContent(this.state.condition).then((data) => {
        this.setState({isLoader: false});
        if(data && Array.isArray(data) && data.length > 0){
          let csvContent = papa.unparse(data);
          this.download(csvContent, 'metrics.csv', 'text/csv;encoding:utf-8');
          this.setState({statusMsg: "File Downloaded successfully"})
        } else this.setState({statusMsg: "No records to download"})
      })
}))

Answer 1

我没有看到您在 this.setState 中的何处运行回调函数。

尝试:

   this.setState(prevState => ({ 
          condition: [...prevState.condition, { name: "readByGroup", operator: "IN  ", value: groups }]
    }),  () => {
     this.props.getMetricsByContent(this.state.condition).then((data) => {
            this.setState({isLoader: false});
            if(data && Array.isArray(data) && data.length > 0){
              let csvContent = papa.unparse(data);
              this.download(csvContent, 'metrics.csv', 'text/csv;encoding:utf-8');
              this.setState({statusMsg: "File Downloaded successfully"})
            } else this.setState({statusMsg: "No records to download"})
          }))
   }

关键是箭头函数作为 setState 的下一个参数。

https://reactjs.org/docs/react-component.html#setstate