我不知道何时应使用<>
和何时应使用:
为属性分配类型。我下面的代码是正确的,但是我不确定为什么我声明React.FunctionComponent<Props>
而不是React.FunctionComonent : Props
interface Props {
speakers : Speaker[]
}
const SpeakersMain : React.FunctionComponent<Props> = (props : Props) => (
<div>
<SpeakersHeader/>
<SpeakerList speakers={props.speakers} />
</div>
);
答案 0 :(得分:2)
const SpeakersMain: React.FunctionComponent<Props> = ...;
应使用,因为在:
之后使用React.FunctionComponent
的语法不正确。
SpeakersMain: React.FunctionComponent
表示SpeakersMain
变量是React.FunctionComponent
类型。尽管<Props>
向React.FunctionComponent
添加了说明,因为在React类型中定义为generic type。 <>
语法允许将Props
作为参数传递。
React.FunctionComponent<Props>
类型意味着它是一个将Props
类型作为其props
参数的函数。
它的工作方式是:
type Foo<T = {}> = (props: T) => void;
type Bar = { bar: number };
var foo1: Foo = (props) => { /* props is supposed to be empty object by default */ };
var foo2: Foo<Bar> = (props) => { /* props is supposed to be Bar */ };