函数返回类型与TypeScript不匹配

Question

我听不懂。我对TypeScript十分了解，并且我会尽量遵守其建议，但这对我来说毫无意义。

在阅读技巧时，我看到了EffectCallback类型的定义，其中包括：

type EffectCallback = (() => void)

我只是直接查看类型的定义，以查看它是否有所不同，正如您所看到的那样，它不再触发TypeScript。

我想念什么？

另一件事是，根据TypeScript告诉我的内容，useEffect期望有一个EffectCallback，它最好是一个返回void作为参数的函数。

问题是，根据React documentation about useEffect，我可以传递一个返回函数的函数。 React使用此功能进行清理。

我的胆量告诉我，有一件我无法理解的小事情，否则我将无法解决！ ?

Answer 1

在您的第一个代码示例中，您有以下内容：

(): EffectCallback => {

这意味着这是一个返回EffectCallback的函数。但是，这不是useEffect所期望的。该功能需要成为一个EffectCallback，而不要返回一个。 EffectCallback要么是什么都不返回的函数，要么是返回拆解函数的函数。

在第二个示例中，您继续进行以下操作：

(): (() => void) => {

现在您要说的是它是一个返回拆解函数的函数。返回拆解函数的函数是执行EffectCallback的合法方法之一，因此它可以匹配。

---

除非您使用要求显式返回类型的棉绒规则，否则我不会为useEffect做显式返回类型而烦恼。仅执行() => {更简单，并且如果您编写的代码返回的内容对于useEffect是非法的，则打字稿会指出这一点。

Answer 2

EffectCallback 是您传递给 useEffect 的函数类型。

如果你想获得 useEffect 的清理函数的类型，你可以简单地使用 ReturnType<EffectCallback>。

例如

useEffect((): ReturnType<EffectCallback> => {
    return (): void => {}
})

你也可以看看类型EffectCallback，看看它是什么

type EffectCallback = () => (void | Destructor);

declare const UNDEFINED_VOID_ONLY: unique symbol;

type Destructor = () => void | { [UNDEFINED_VOID_ONLY]: never };