react—— 类型检查prop-types

类型检查

1，注意: React.PropTypes 自 React v15.5 起已弃用。请使用 prop-types 库代替。

import PropTypes from 'prop-types';

class Greeting extends React.Component {
  render() {
    return (
      <h1>Hello, {this.props.name}</h1>
    );
  }
}

Greeting.propTypes = {
  name: PropTypes.string
};

2，功能

（1）使用 PropTypes.element限制单个子代

（2）defaultProps 为组件props定义默认值：

（3）将 transform-class-properties 的 Babel 转换器

和defaultProps结合使用。

即：React 组件类中声明 defaultProps 作为静态属性。

class Greeting extends React.Component {
  static defaultProps = {
    name: 'stranger'
  }

  render() {
    return (
      <div>Hello, {this.props.name}</div>
    )
  }
}

备注：类型检查发生在 defaultProps 赋值之后，所以类型检查也会应用在 defaultProps 上面。