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({ })

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...