Javascript react组件道具中的流泛型

我试图用泛型键入组件的道具，但flow没有捕捉到错误。基本上，我希望有一个具有两个道具的组件

fetch

和

cb

。无论

fetch

返回什么类型，都应该是

cb

的返回类型

// @flow
import React, { Component } from 'react';

type Props<T> = {
  fetch: () => Promise<T>,
  cb: T => T,
};

class Client<T> extends Component<Props<T>> {

  componentDidMount() {
    const { fetch, cb } = this.props;
    fetch().then(cb);
  }

  render() {
    return (<div />)
  }
}
        
const App = () => (
  <Client
    fetch={ () => Promise.resolve(1) } 
    cb={ n => 'sfd' } />
 );

---

在功能方面，你是错的。应将其分配给变量：

function f<T>(a: () => T, b: T => T): T {
    return b(a());
}

const r: number = f(() => 2, n => ""); // error

函数f（a:（）=>T，b:T=>T）：T{ 返回b（a（））； } 常数r:number=f（（）=>2，n=>“”）；//错误

---

但如果是组件道具。。。也许它期望被参数化，但我找不到一种方法来参数化组件。

正如James Kraus在一篇评论中所说的，flow是在推断t的类型

数字|字符串

。没有什么可以阻止泛型成为求和类型，除非您限制其中一个函数或使用具体类型参数化泛型函数，否则flow将继续推断求和类型

与基里尔所写的非常接近，但可能更容易理解限制的来源是：

function f<T>(a: () => T, b: T => T): T {
    return b(a());
}
        
const r = f<number>(() => 2, n => "");

函数f（a:（）=>T，b:T=>T）：T{ 返回b（a（））； } 常数r=f（（）=>2，n=>）； 在这里，您将在第二个函数中得到一个错误，因为我们已经告诉了flow

此泛型必须是一个数字，请强制执行

---

然后它完成了它的工作。

看，flow似乎需要一种类型的

cb

论据，就在Alex的评论上：flow似乎在推断

cb

属性的类型为

（string | number）=>number

。这就是为什么它“需要”为cb arg指定的类型。我使用泛型来避免定义具体类型：），这是非常基本的类型检查。在此基础上，您需要指定

r:number

的原因是Flow认为从函数返回

字符串| number

是完全可以接受的。我不太确定这是最好的解释，但这就是它的解释。

function f<T>(a: () => T, b: T => T): T {
    return b(a());
}
        
const r = f<number>(() => 2, n => "");