创建组件的形式:
ES5写法:React.createClassES6写法:React.Component 官方推荐无状态的函数写法,又称为纯组件SFC
无状态功能组件
无状态的函数创建的组件是无状态组件,它是一种只负责展示的纯组件
优势:避免无意义的状态检查,提高性能
您可能以前将这些称为“无状态组件”。 我们现在介绍的这些组件将具有 React state(状态) 的能力,所以我们更喜欢称他为 “函数式组件”。
在 SFC 中添加一个接口定义:
import * as React from “react”interface WelcomeProps {name: string,}const Welcome: React.SFC<WelcomeProps> = (props) => {return <h1>Hello, {props.name}</h1>;}
为 props 设置一些默认值
import * as React from “react”interface WelcomeProps {name?: string, // Change the required prop to an optional prop.}const Welcome: React.SFC<WelcomeProps> = (props) => {return <h1>Hello, {props.name}</h1>;}Welcome.defaultProps = {name: “Guest User”, // This value is adopted when name prop is omitted.}
React.SFC 为我们定义了一些通用的 props 类型
