【React组件】关于React组件通过PropTypes验证接收值的类型使用方法

最新推荐文章于 2023-11-29 09:56:25 发布

林大年

最新推荐文章于 2023-11-29 09:56:25 发布

阅读量166

点赞数

分类专栏： React 文章标签： react 组件化

本文链接：https://blog.csdn.net/llw6868/article/details/110431704

版权

本文介绍如何在React组件中使用PropTypes进行属性值的类型检查。内容包括引入依赖、验证器的使用方法及控制台的输出效果。详细步骤和官方文档链接可供参考。

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

1、在需要验证的组件引入依赖包

import PropTypes from 'prop-types'

2、使用位置：

class testUnit extends PureComponent {
	constructor(props) {
		super(props);
		this.state = {	}
	}
	
	render(){
		console.log("子组件渲染")
		let {msg} = this.props
		return(
			<div style={
    {padding:10}}>{msg}</div>
		)
	}

}
testUnit.propTypes={  // 在这里使用  类名.propTypes{ // 接收的值 }
	msg: PropTypes.string
}

3、PropTypes提供了大量的验证器如：