В TypeScript, когда использовать <> и когда использовать:
Я не понимаю, когда мне следует использовать <>, а когда мне следует использовать : для присвоения типа атрибуту. У меня есть правильный код ниже, но я не уверен, почему я объявляю React.FunctionComponent<Props>, а не React.FunctionComonent : Props
interface Props {
speakers : Speaker[]
}
const SpeakersMain : React.FunctionComponent<Props> = (props : Props) => (
<div>
<SpeakersHeader/>
<SpeakerList speakers = {props.speakers} />
</div>
);
Ответы 1
const SpeakersMain: React.FunctionComponent<Props> = ...;
следует использовать, потому что использование : после React.FunctionComponent было бы неправильным синтаксисом.
SpeakersMain: React.FunctionComponent означает, что переменная SpeakersMain относится к типу React.FunctionComponent. В то время как <Props> добавляет пояснение к React.FunctionComponent, потому что он был определен как общий тип в типизации React. Синтаксис <> позволяет передавать 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 */ };
Спасибо @estus Имеет смысл. Я парень C#, так что должен был знать об этом. Я просто не думал о том, что JavaScript имеет смысл. Тип перехода от нетипизированного к типизированному, а затем снова к типизированному снова.
Рад, что помог.
В TypeScript много постороннего синтаксиса. Мне понадобится время, чтобы понять, что такое "Хорошие части"
Возможно, вы захотите начать с чистого TS, прежде чем погружаться в React + TS. Это общая функция TS.