Question

我最近创建了一个新的react-native项目，发现组件语法变得export default class WelcomeScreen extends Component<Props>与以前的export default class WelcomeScreen extends Component不同。

我认为它将取代下面的代码的语法

  constructor(props) {
    super(props)
  }

但是经过测试后，我发现我仍然必须使用上面的代码来引用props，那么此语法<Props>的确切功能是什么？

Answer 1

Component<Props>是Flow的语法，用于检查Props上的数据类型。当数据在您的代码中移动时，Flow会推断类型并跟踪数据。

示例：

    // @flow
    import * as React from 'react';
    import { Text } from 'react-native';

    type Props = {
      bar: string, // this mean type data of bar is string and is required.
    };

    class MyComponent extends React.Component<Props> {
      render() {    
        return <Text>{this.props.bar}</Text>;
      }
    }

参考：

https://flow.org/en/

https://flow.org/en/docs/react/

react-native的`Component <props>`是什么意思

1 个答案: