17. prop types 库的使用原理 - yiqunkeke/react-jianshu-shangguigu-zty GitHub Wiki

import PropTypes from 'prop-types'; // 引入库
// PropTypes 提供了一系列的校验规则,来确保你接收的数据是合法的。
// 当传递了不合法的值时,控制台会报出警告。

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

// 给组件添加 `propTypes`属性  ---- 校验prop属性的类型
Greeting.propTypes = {
  name: PropTypes.string
};
// `propTypes` 只会在开发环境中做校验。(出于性能原因)

// 给组件添加`defaultProps`属性   ---给props添加默认值 
Greeting.defaultProps = {
  name: 'Stranger'
};
// `propTypes`会在`defaultProps`之后会解析,所以`propTypes`也同样会作用于`defaultProps`
⚠️ **GitHub.com Fallback** ⚠️