• propTypes、defaultProps 作为 properties 定义,也可以在组件外部通过键值对方式进行设置。
• 设置组件初始的 state不支持 getInitialState,可以在组件的constructor中通过this.state来设置,直接作为 properties 定义也可以。
• 不支持 mixins,可以使用高阶组件写法,或者 decorator。
1. 顶层API
最简单的React组件及渲染
react.js
Component API
react-dom.js
react-dom-server.js
2. jsx语法
类似 xml 的语法,用来描述组件树
不用JSX,用React提供的API写的话
2.1 注释、命名、根元素个数、JSX 嵌入变量
- React只有一个限制, 组件只能渲染单个根节点。如果你想要返回多个节点,它们必须被包含在同一个节点里。
2.2 styles
2.3 JSX SPREAD
可以用通过 {...obj} 来批量设置一个对象的键值对到组件的属性,注意顺序
2.4 属性名不能和 js 关键字冲突
例如:className, readOnly, htmlfor
3. 数据流:state props propType
3.1 state && setState
用状态控制组件变化 可以把一个组件看做一个状态机, 每一次状态对应于组件的一个 ui
组件内部的状态,可以使用 state
3.2 props
通过 this.props 可以获取传递给该组件的属性值,还可以通过定义 getDefaultProps 来指定默认属性值(这是ES5的写法,ES6定义组件的默认props可以直接写props)
下面几个是props的常用API:
• this.props.children
• this.props.map
• this.props.filter
props是调用组件的时候传递进去的数据,一般用于组件树数据传递
3.3 propTypes
通过指定 propTypes 可以校验props属性值的类型,校验可提升开发者体验,用于约定统一的接口规范。