React中队prop进行类型限制

最新推荐文章于 2024-08-04 20:37:24 发布

閉丄眼聆厛倖輻

最新推荐文章于 2024-08-04 20:37:24 发布

阅读量498

点赞数

分类专栏： react 文章标签： react.js

本文链接：https://blog.csdn.net/weixin_52005030/article/details/121560086

版权

本文介绍如何在React应用中使用PropTypes库对组件props进行类型检查和设置默认值。通过`npm i prop-types`安装后，我们可以导入并使用PropTypes来定义组件所需的prop类型和默认值，确保代码的质量和健壮性。

摘要由CSDN通过智能技术生成

在类型传递中,我们要对prop中的类型进行限制

最新版本有一个PropTypes进行处理

安装:npm i prop-types

引入:import PropTypes from 'prop-types'

使用:


Person.propTypes = {   //你类的属性规则 ,, static相当于直接给类本身添加了属性
                name: PropTypes.string.isRequired,
                sex: PropTypes.string,
                age: PropTypes.number,
                spack: PropTypes.func  
            }

指定默认标签:

Person.defaultProps = {
				sex:'男',//sex默认值为男
				age:18 //age默认值为18
			}

如果是在类里面;

	class Person extends React.Component{

			constructor(props){
				//构造器是否接收props，是否传递给super，取决于：是否希望在构造器中通过this访问props
				// console.log(props);
				super(props)
				console.log('constructor',this.props);
			}

			//对标签属性进行类型、必要性的限制
			static propTypes = {
				name:PropTypes.string.isRequired, //限制name必传，且为字符串
				sex:PropTypes.string,//限制sex为字符串
				age:PropTypes.number,//