const App: ( ) = > React$Node = ( ) = > {...: 이 순서의 의미는 무엇입니까?

const App: ( ) = > React$Node = ( ) = > {...: 이 순서의 의미는 무엇입니까?

에react-native init ProjectName, 메인 앱 파일App.js에는 다음 방법으로 컴포넌트를 선언하는 내용이 포함되어 있습니다.

const App: () => React$Node = () => {...}

이 설명서는 무슨 뜻입니까?

제 말은, 저는 컴포넌트가 다음과 같이 정의되는 것에 익숙합니다.const App = () => {...}그래서 그 사이에 있는 표현은 잘 모르겠어요.: () => React$Node.

Flow의 유형 정의로, 지속적인 App이 유형 함수이며 ReactNode를 반환합니다.

React Node는 다음 유형 중 하나입니다.ReactChild | ReactFragment | ReactPortal | boolean | null | undefined

이는 App이 반환할 수 있는 함수, 유효한 JSX(React Native에서는 View, Text, .etc에서 무엇이든), ReactFragment, React를 의미합니다.포털, 부울, null, 정의되지 않음

달러 기호가 헷갈리시다면, 여기 설명과 링크가 있습니다.https://www.saltycrane.com/flow-type-cheat-sheet/latest/

이름에 $가 포함된 "개인" 또는 "매직" 유형에는 별도의 섹션이 있습니다.여기를 참고하고 여기에 코멘트를 주세요.업데이트:이러한 유형의 일부는 여기서 문서화되어 있습니다.

쉽게 생각하면 됩니다.Node부터React(범위/범위라고 생각됩니다)

App 컴포넌트를 함수로 선언하는 형태이기도 하지만 다음과 같이 변경할 수 있습니다.

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View } from 'react-native';

export default class App extends Component {
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.instructions}>Hello World!</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF'
    },
    instructions: {
        textAlign: 'center',
        color: '#333333',
        marginBottom: 5
    }
});

마지막 줄에 Export default App(기본 앱 내보내기) 문도 삭제해야 합니다.

React$Node는 react.js에서 정의된 유형입니다.

declare type React$Node =
  | null
  | boolean
  | number
  | string
  | React$Element<any>
  | React$Portal
  | Iterable<?React$Node>;

언급URL : https://stackoverflow.com/questions/58276469/const-app-reactnode-what-does-it-mean-this-instruction