Son.propTypes = { optionalArray: PropTypes.array,//检测数组类型 optionalBool: PropTypes.bool,//检测布尔类型 optionalFunc: PropTypes.func,//检测函数（Function类型） optionalNumber: PropTypes.number,//检测数字 optionalObject: PropTypes.object,//检测对象 optionalString: PropTypes.string,//检测字符串 optionalSymbol: PropTypes.symbol,//ES6新增的symbol类型 }
【注意】下面这些是从官方英文文档里引用过来的，你大概能够注意到，五种基本类型中的undefined和null并不在此列，propTypes类型检测的缺憾之一是，对于undefined和null的值，它无法捕捉错误
让我们把上述实例中的Father组件传递给Son组件修改一下,改成：
class Father extends React.Component{ render(){ return (<Son number = {null} array = {null} boolean = {null} />) } }
结果是输出台不报任何错误，（当然你改成undefined也是同样效果）。
3.2 通过oneOfType实现多选择检测——可规定多个检测通过的数据类型
上个例子中类型检测的要求是一个变量对应一个数据类型，也就是规定的变量类型只有一个。那么怎样能让它变得灵活一些，比如规定多个可选的数据类型都为检测通过呢？PropTypes里的oneOfType方法可以做到这一点，oneOfType方法接收参数的是一个数组，数组元素是你希望检测通过的数据类型。
import React from 'react' import PropTypes from 'prop-types'; class Son extends React.Component{ render(){ return (<div style ={{padding:30}}> {this.props.number} </div>) } } Son.propTypes = { number:PropTypes.oneOfType( [PropTypes.string,PropTypes.number] ) } class Father extends React.Component{ render(){ //分别渲染数字的11和字符串的11 return (<div> <Son number = {'字符串11'}/> <Son number = {11}/> </div>) } }
这时候，因为在类型检测中，number属性的规定类型包括字符串和数字两种，所以此时控制台无报错
当然，如果你改为number = {数组或其他类型的变量}，那么这时就会报错了
3.3 通过oneOf实现多选择检测——可规定多个检测通过的变量的值
3.2是规定了多个可检测通过的数据类型，那么同样的道理，我们也可以规定多个可检测通过的变量的值，这就要用到PropTypes里的oneOf方法，和PropTypes方法一样oneOf方法接收参数的是一个数组，数组元素是你希望检测通过的变量的值，比如我们把上面类型检测的部分改成：
Son.propTypes = { number:PropTypes.oneOf( [12,13] ) }
那么运行时就会报这样一段错误：
3.4 arrayOf,objectOf实现多重嵌套检测
试想一下，如果我们检测的是基本类型的变量，那么这自然是很简单的，但当我们要检测的是一个引用类型的变量呢？当我们除了检测这个变量是否符合规定的引用类型外（Object/array），还想要进一步检测object中的属性变量或array中数组元素的数据类型时，单靠上面的方法已经不能满足要求了。这时候就要用到PropTypes的arrayOf，objectOf方法。
arrayOf接收一个参数，这个参数是规定的数组元素的数据类型。objectOf接收的参数则是属性的数据类型
我们对上述例子做些修改：
import React from 'react' import PropTypes from 'prop-types'; class Son extends React.Component{ render(){ return (<div style ={{padding:30}}> {this.props.array} </div>) } } Son.propTypes = { array:PropTypes.arrayOf(PropTypes.number) } class Father extends React.Component{ render(){ return (<div> <Son array = {[1,2,3,4]}/> </div>) } }
正常渲染，然后我们把<Son array = {[1,2,3,4]}/>改为<Son array = {['1','2','3','4']}/>，报错
