<{}> 在 JavaScript 中扩展末尾是什么意思?



我在react native的一个教程中遇到了以下语法。组件的声明,看起来像:

export default class App extends Component<{}> {
//implementation
}

我的问题是:这个<{}>是什么意思,这个声明与这个有什么不同:

export default class App extends Component {

这个片段是用typescript编写的。<>语法用于指定零部件上的通用约束。

我的建议是,如果你不使用typescript,在阅读教程时基本上可以忽略这个符号然而,如果你有兴趣了解更多:

以下是关于typescript泛型的文档。

这里有一些关于反作用/反作用本机中Component类的文档,专门用于typescript。

基本上,react组件有两个通用参数,一个用于组件的属性(this.props),另一个用于状态(this.state)。

此外,{}是一个没有属性的空对象的类型,所以这基本上意味着可以在不指定任何属性的情况下创建组件。您可以在JSX中使用这个组件,只需一个简单的<App />。您应该注意,默认情况下,props和state都只是{},因此不需要像第一个代码段中那样手动指定它们。事实上,第一个和第二个片段在功能上是相同的(尽管只有第二个是有效的jsx,但第一个需要typescript编译)。

最后,虽然另一个答案是正确的,但您应该注意,在这种情况下,<>内部的内容特别是组件中通过this.props访问的"道具"对象的类型。一般来说,通用约束可以表示几乎任何东西,但在这种特殊情况下,它是道具的类型。

这是一个typescript语法,<>内部的内容是您期望的对象类型。

当我们谈论react/react native时,它更可能是(facebook的)流而不是typescript。

它们的语法非常相似,在本例中完全相同,但流由RN的打包程序开箱即用地支持,通常使用.js扩展,并且在该生态系统中更为普遍。

无论哪种方式,@CRice的含义都是正确的——它是一个泛型,在本例中指示类组件的props的类型。

相关内容

  • 没有找到相关文章

最新更新