Axios cancel适用于每个页面

vbopmzt1  于 2023-03-29  发布在  iOS
关注(0)|答案(1)|浏览(123)

我创建了一个axios示例,如下所示:

export const requestController = new AbortController();

const httpClient = axios.create({
  baseURL: `${REACT_APP_BASE_URL}/v1`,
  signal: requestController.signal,
});

在我的主页上,我有useEffect来获取数据,并在卸载时取消请求

const MainPage = () => {
....
useEffect(() => {
   httpClient.get(...)
   httpClient.get(...)
   httpClient.get(...)

    return () => {
      requestController.abort();
    };
}, [])
}

但是其他页面的请求也会停止工作。即使我取消了一个页面的请求。如何修复它?更新:是的,我知道我可以只在我需要的地方使用控制器。但是我需要更常见的解决方案,以便它可以为每个未安装的组件工作-取消请求。这可能吗?

wz1wpwve

wz1wpwve1#

看起来,您对 * 每个 * 请求都使用了AbortController的同一个示例(因为它是在默认的httpClient上设置的),所以当然,是的,用信号通知它,将取消该httpClient发出的每个请求。您应该从默认客户端删除signal,并为每个需要取消的请求创建一个AbortController,并将其传递给该特定请求。这样,只有这个特定的请求会被中止。。

useEffect(() => {
   let ueAbortController = new AbortController();
   httpClient.get(url1, { signal: ueAbortController.signal} )
   httpClient.get(url2)
   httpClient.get(url3, { signal: ueAbortController.signal} )

    return () => {
      ueAbortController.abort();
    };
}, [])

仅出于演示目的,在上面的代码片段中,只有对url1url3的请求会被中止,但对url2的请求不会,因为它没有设置中止信号...

相关问题