类型检查
-
defaultProps默认属性值 -
propTypes限制接收的属性类别(仅在开发模式中检测)
基本写法
import PropTypes from 'prop-types';
class Greeting extends React.Component {
render() {
return (
<h1>Hello, {this.props.name}</h1>
);
}
}
Greeting.propTypes = {
name: PropTypes.string
};
使用 `isRequired' 链接上述任何一个，以确保在没有提供 prop 的情况下显示警告。
defaultProps 设置默认属性
//类型检测
TodoItem.propTypes = {
content: PropTypes.string,
deleteItem: PropTypes.func,
index: PropTypes.number,
// 你可以使用 `isRequired' 链接上述任何一个，以确保在没有提供 prop 的情况下显示警告。
test: PropTypes.string.isRequired
}
//设置默认值
TodoItem.defaultProps = {
test: '科比布莱恩特'
}
- 某种类型之一
// 一个对象可以是多种类型其中之一
optionalUnion: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number,
PropTypes.instanceOf(Message)
]),
props，state与render函数的关系
- 当组件的state或者props发生改变时，render函数就会重新执行（自身）
- 当父组件的render函数执行时，它的子组件的render都将被重新执行
