javascript - 如何取消 ComponentWillUnmount 中的所有请求？

Question

根据docs , ComponentWillUnmount 能够取消请求。

我有一个页面请求加载 iframe，以及其他页面请求。如果用户决定在页面仍在处理请求时离开该页面，我该如何取消这些请求，以免影响用户随后访问的其他页面？

我应该注意，我正在使用 Redux 和 Redux-saga。

Answer 1

只需将 componentWillUnmount 视为机会函数即可。这是你按照文档所说的那样做的机会，执行 React 不会自行执行的任何额外清理。

就 XHR 请求而言，您需要有一个支持取消 promise 的 Promise 库。如果您使用的库确实支持，那么在 componentWillUnmount 中，您只需确保您可以访问所有 Promise 并取消每一个。

至于取消其他任何东西，您只需要使用为您提供的任何功能来取消任何您想取消的东西。如果它们是取消它的函数，那么如果您需要在卸载组件时取消它，则使用 componentWillUnmount 的性质来执行此操作。

作为我们如何在此处使用它的示例:如果一个组件要发出请求，我们在该组件上设置一个属性，该属性是一个数组并保存所有请求。我们称之为 this.statePromises。每当我们发出请求/Promise 时，我们都会将该 Promise 推送到 this.statePromises 中。在 componentWillUnmount 中，我们有以下内容

componentWillUnmount() {
  this.statePromises.forEach(p => p.cancel());
 }

p 是一个 promise 。这仅适用于我们用于 promise 的库 bluebird。但这应该让您了解如何使用 componentWillUnmount 进行任何额外的清理。