React/React Native中 Component{} 和 Component<Props>{} 的区别是什么？

Question

我已经设置好了React Native环境。第一次打开App.js时，我发现：

class MyApp extends Component<Props>{
    ...
}

通常我们会这样做：

class MyApp extends Component{
    ...
}

请问什么是<Props>，在react/react native中为什么要使用<Props>？能否给出一个例子会更好。

- Purple Bytes

---

<Props>部分告诉编译器/代码编辑器在组件创建时传递给构造函数的变量类型。它并不是必须的，可以被移除，但在相当大的代码库中，当你不确定需要什么类型的变量时，它很有用。 - dotconnor

简而言之，类型安全。或者说两个词吧。 - MTCoster

如果有人的答案解决了你的问题，你可能想使用大复选框接受它作为答案。https://i.stack.imgur.com/QpogP.png - Abdul Rauf

Answer 1

您所看到的代码实际上使用了Flow类型。Flow是Facebook开发的JavaScript静态类型检查器。

参考: https://flow.org/en/docs/react/components/

- Abdul Rauf

---

阅读文档基础知识后，我想知道这个 flow 模块是否已安装在 React Native 中？ - Purple Bytes

@DhuBytes 这取决于你如何设置你的react-native环境。例如，是使用create-react-native-app还是手动设置？你可以检查node_modules目录下是否存在babel-plugin-react-flow-props-to-prop-types目录 - Abdul Rauf

不，如果在App.js中存在**<Props>指令，那就意味着flow**模块也已经安装了，对吧？ - Purple Bytes

应该正确安装它。请更新您的问题以添加“如何设置您的项目？” 您可以快速构建和运行您的项目以检查它是否正常工作？如果流程未与Babel配置，则无法构建。 - Abdul Rauf

在 flow 和 react native 的术语中，babel 用于什么？ - Purple Bytes