react-native – 扩展Component之后的<{}>语法是什么?

前端之家收集整理的这篇文章主要介绍了react-native – 扩展Component之后的<{}>语法是什么?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我今天使用React Native 0.51.0开始了一个新项目,并注意到默认项目文件的类语法添加了一些新内容,< {}>扩展组件后的语法:
export default class App extends Component<{}> {
   ...
}

我尝试做研究,但大多数搜索引擎都会忽略特殊字符,即使是精确的字符串匹配,所以试图找出这种语法是很困难的.我做了一些测试,并且能够发现这个变化出现在v0.49.0中. release notes没有提到这个添加语法的功能.

很多模糊的关键字搜索和阅读让我相信这可能是与TypeScript相关的语法,但是对语言不熟悉,我不知道如何搜索并找到更多有关语法的内容而不知道是什么适当的用语是.谁能告诉我语法的名称及其作用?特别是关于React Native.

它与您将在组件中收到的道具的 Flow种类型相关.组分LT; {}>意味着你不希望组件接收道具.

使用Flow和React.Component,您可以定义props和state的类型(有关详细信息,请参阅React$Component类型声明).

关于React组件的Flow documentation示例

import * as React from 'react';

type Props = { /* ... */ };

type State = {
  count: number,};

class MyComponent extends React.Component<Props,State> {
  state = {
    count: 0,};

  componentDidMount() {
    setInterval(() => {
      this.setState(prevState => ({
        count: prevState.count + 1,}));
    },1000);
  }

  render() {
    return <div>Count: {this.state.count}</div>;
  }
}

<MyComponent />;

猜你在找的React相关文章