Javascript 取消使用效果'；s与TypeScript异步，正确的方式

我有一个简单的例子让我感到悲伤：

useffect（（）=>{
axios.get（…）。然后（…）。catch（…）
}，[props.foo]）

警告：无法对未安装的组件执行react状态更新

做了一些调查，比较容易理解。TypeScript似乎不喜欢这种方法，因为

useffect

应该返回一个空值

useffect（（）=>{
让isSubscribed=true
axios.get（…）。然后（…）。catch（…）
return（）=>（isSubscribed=false）
}，[props.foo]）

类型脚本：

/**
*接受包含命令式、可能有效代码的函数。
*
*@param effect命令函数，可返回清理函数
*@param deps如果存在，则仅当列表中的值更改时才会激活该效果。
*
*@version 16.8.0
*@见https://reactjs.org/docs/hooks-reference.html#useeffect
*/
函数useffect（效果：EffectCallback，deps？：DependencyList）：void；

如何使用TS在my

useEffect

中实施

isSubscribed

---

谢谢。

useffect

本身返回

void

，但提供给

useffect

的函数类型为

EffectCallback

。这被定义为：

// NOTE: callbacks are _only_ allowed to return either void, or a destructor.
// The destructor is itself only allowed to return void.
type EffectCallback = () => (void | (() => void | undefined));

这意味着您的效果回调实际上可以返回一个函数，该函数必须返回

void

或

undefined

现在，您可以解决问题，避免使用

isSubscribed

变量调用

setState

。但另一种（也许更好）方法是直接取消请求

useEffect(() => {
  const CancelToken = axios.CancelToken;
  const source = CancelToken.source();

  axios.get('...', { cancelToken: source.token }).then(/**/).catch(e => {
    if (axios.isCancel(thrown)) {
      console.log('Request canceled', thrown.message);
    } else {/* handle error */}
  });

  return () => source.cancel();
}, [props.foo])

这也记录在了

当前代码的问题是，析构函数返回布尔值

isSubscribed

。与其返回赋值，不如将赋值放入函数体中：

return () => {
  isSubscribed = false;
}

---

我想这篇reddit文章用大括号来解决这个问题：

{isSubscribed=false}