React props 校验

安装 prop-types

yarn add prop-types / npm i prop-types

// 1、导入prop-types包
import PropTypes from 'prop-types'

// 2、添加props校验
App.propTypes = {
    
    
    colors: PropTypes.string
}
// 添加props默认值
App.defaultProps = {
    
    
   colors: 3
}
const App = (props) => {
    
    
	// 3、使用 props 校验过的值
    const string = props.colors
    return (
        <ul>
            {
    
    string}
        </ul>
    )
}

ReactDOM.render(<App colors={
    
    19}></App>, document.getElementById('root'))

props校验：允许在创建组件的时候，就指定props的类型、格式等

作用：捕获使用组件时因为props导致的错误，给出明确的错误提示，增加组件的健壮性

常见类型：array、bool、func、number、object、string

React元素类型：element

必填项：isRequired

特定结构的对象：shape({ })