react： 在子组件中 检验父组件传过来的参数是否是想要的参数类型 prop-types

本文主要是介绍react： 在子组件中 检验父组件传过来的参数是否是想要的参数类型 prop-types，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

大家好，我是梅巴哥er ， 这里讲个小知识点： 参数的类型验证。

目的：

• 当父组件传过来的参数，不是我们需要的参数类型时，给出警告。

安装：

• npm install prop-types

引入：

• import PropTypes from 'prop-types'

语法：

• static propTypes = { 参数名: PropTypes.数据类型}

案例：

import React, { Component } from 'react' 
import PropTypes from 'prop-types'class Header extends Component {// 检验父组件传过来的参数是否符合需要的类型static propTypes = {// 要求传过来的参数是字符串形式// 不然就会给出警告（不是报错，是warning）//这里的string表示 要求传过来的title参数需要是字符串类型title: PropTypes.string }render() {return (<header>{ this.props.title }</header>)}
}
class App4 extends Component {render() {return (<div>{/* 这个ttile是字符串类型的123， 没有警告*/}<Header title='123' />{/* 这个ttile是数字类型的123， 有警告*/}<Header title={ 123 } /></div>)}
}export default App4 

这篇关于react： 在子组件中 检验父组件传过来的参数是否是想要的参数类型 prop-types的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---