javascript - react 组件 Prop 中的流泛型

Question

我正在尝试使用泛型键入组件的 props，但 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' } />
 );

在底部，我将一个函数传递给 fetch，它解析为 number 但 cb 返回一个 string 并且没有流错误。为什么？

这是 repl .

这甚至不是 react 的东西。一个简单的函数将无法检查类型:

const fun = <T>(a: () => T, b: T => T): T => b(a());
fun(() => 2, n => 'qwe');

Answer 1

在函数的情况下你错了。它应该分配给一个变量:

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

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

try it

但是对于组件 props 的情况......也许它希望被参数化，但我找不到一种方法来参数化组件。