组件规格
当创建一个React组件,并调用 React.createClass()
,你需要提供一些Object
对象,例如必须的render
,还有其他一些可选的Object
对象。
render
这个函数对象必须存在,且一定存在返回值。
render: function () { return (<h2>Hello,World!</h2>); }
官方规范说明这个方法一定要pure(干净),保证职责单一,所有数据通过props
和state
来。利于组件的复用和维护。写React一定要约束好各种规范!
返回值是 ReactElement
getInitialState
object getInitialState()
在组件装载前会调用一次,函数的返回值对象,可以在this.state
查询和使用。
getDefaultProps
设置组件props默认值
object getDefaultProps()
在组件装载前会调用一次,函数的返回值对象,可以在this.props
查询和使用。
和state不同的是,props在每个实例里都可以访问到,只会拷贝一次,而this.state
是实例独享的。
propTypes
object propTypes
可以约束检测你的参数的,发现不匹配就会console.wran()
来提示错误,但是不会报错不执行。
mixins
array mixins
statics
object statics
var MyComponent = React.createClass({ statics: { customMethod: function(foo) { return foo === 'bar'; } },render: function() { } }); MyComponent.customMethod('bar'); // true
displayName
string displayName
用于debug时候的定位。
生命周期方法
实例化
getDefaultProps
getInitialState
componentWillMount
render
componentDidMount
当组件类再次被调用时getDefaultProps
和 getInitialState
方法不会被调用。
存在期
componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate
render
componentDidUpdate
componentWillReceiveProps(nextProp){ //todo }
componentWillReceiveProps
是当组件props改变的时候触发