处理axios循环中的取消

时间:2018-09-27 03:03:29

标签: javascript reactjs axios

我有以下情况

const config = {
    timeout: 30000,
    headers: {
        Authorization: ``
    },
    cancelToken: cancelSource.token
};

for (var i = 0; i < data.length; i++) {
    let itr = 0;
    axios
        .post("/my/url", "", config)
        .then(response => {
            if (response.status === 200) {
                if (i === itr) {
                    //set state here
                }
            }
        })
        .catch(error => {
            if (axios.isCancel) {
                // How to know if the cancel stops already?
            }
        });
}

例如: 我有16个项目,有8个项目被取消。我怎么知道取消是否完成? 所以我可以在这里设置一些后期处理。

1 个答案:

答案 0 :(得分:0)

axios.isCancel是一个期望将错误作为参数的函数。但是您称它为钥匙。所以

更改

<a routerLink='/posts'>View Posts</a>
<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>
<router-outlet></router-outlet>

收件人

  .catch(error =>{
      if(axios.isCancel){
          // How to know if the cancel stops already?
     }
  });

通过上述更改,您可以确定取消请求的时间。您可以简单地使用局部变量来管理接收到的数据,直到数据被取消为止。您需要在此处使用局部变量的原因是因为循环内不允许使用setState。因此,将所有数据推送到数组中,最后将该数组分配给循环外的组件状态