나는 새가 react-native init
를 사용하여 기본 프로젝트를 반응하여 생성 된 템플릿, 주요 구성 요소 클래스는 다음과 같습니다 만든 기본 <{}> 구문을 반응한다. 나는 전에 이것을 보지 못했고 모든 예는 그것을 생략 한 것처럼 보인다. 그 목적이 무엇이며 필요한지 궁금하다.는
는
답변
이것은 Typescript of Flow입니다. 일반적으로 propType은 propType이 아니라 인터페이스 또는 유형으로 표시됩니다. 그런 다음 유형이 React.Component에 제네릭으로 전달됩니다. 소품의
유형은 실제로
매우 유용하고 편리한 물건 주
에 대한 두 번째 두 개의 일반적인 인수, 거기에 전달 된 유형 플러스{ children?: ReactNode }
될 것이다. https://www.typescriptlang.org/docs/handbook/react-&-webpack.html
https://www.typescriptlang.org/docs/handbook/generics.html 이러한 흐름 유형 약어입니다. https://flow.org/ 파일 상단에 @flow
개의 주석이 있고 프로젝트 루트에 .flowconfig
파일이 있음을 알 수 있습니다.
여기에서 흐름을 사용하는 것은 선택 사항이지만 버그를 잡는 데 도움이됩니다.
typescript를 사용할 때 예상되는 값 유형을 지정해야합니다. 이를 통해 컴파일 시간 동안 불일치 속성을 감지하고 오류의 양을 줄일 수 있습니다.
Component<{}>
을 입력하면 Props
의 유형은 {}
이고 유형은 컴포넌트입니다.
이 Component 클래스는 모양의 반작용하는 방법입니다
, 유형 <Props, State>
을 의미하는 <P, S>
이다.
<P>
을 갖는다
ComponentClass 불리는 다른 인터페이스가있다
, any
상태로 내부적으로 새로운 구성 요소를 초기화
. 이 인터페이스는 ReactElement's type에 사용됩니다
그래서 모두 모두를
, 당신은 어떤 소품을지지 않습니다하고 있지만, 모든 종류의 상태를 가질 수있는 구성 요소를 정의하고 있습니다. 이는 대개 구성 요소의 상호 작용에 대해 잘 모를 때 수행됩니다.이상적으로 구성 요소는 다음과 같아야합니다
는interface IComponentState {
...
}
interface IComponentProps {
...
}
export class MyComponent<IComponentProps, IComponentState> extends React.Component {
...
}
이 필요한 속성을 전달하는 소비자를 시행하고 국가의 적절한 값을 가지고 당신을 적용합니다.
그러나 반응하는 원시 파일에는 'ts'가 아닌'js' 확장자가 있습니다. –