我有一个组件
<ButtonGroup
value={value}
options={[1, 2, 3, 4, 5, 6].map((x) => {
return { label: x, value: x };
})}
/>
我正在使用Flow进行类型检查,想知道是否有可能让ButtonGroup
组件以这样一种方式进行泛型类型化,即如果value
的类型与option.[0].value
的类型不相同,则会引发Flow错误?这应该适用于任何匹配类型,例如数字,数组等。并且仅在value
和option[at_some_index].value
的类型不同时才会引发
我目前拥有的:
type Props<T> = {
options: Array<{
label: React$Node,
value: T,
}>,
value: T,
};
这对于检查匹配的类型很有效,但只适用于特定的类型。如果我做了
export const ButtonGroup = ({options, value}: Props<number>) => {do stuff}
它将像预期的那样对数字类型起作用,但是如果我添加联合类型,使其对字符串,数组具有相同的行为,就像这样,如果值的类型不匹配,Props<number | string | []>
流将停止引发错误。
下面的也不行:
export const ButtonGroup = <T>({options, value}: Props<T>) => {do stuff}
我知道Typescript中的this can be done,只是想知道这是否可以在Flow中完成?
谢谢大家!
1条答案
按热度按时间nukf8bse1#
我认为问题是
T
在所有示例中都被number | string | []
替换。所以你最后会得到这样的东西可能是你正在寻找的:
这里有一个流程Try It链接来查看示例