一、基本介绍
1、属性确认的作用
1）、使用React-native创建的组件是可以复用的，所以我们封装的组件可以用在其他项目或给项目组其他人使用。但是别人可能对这个组件不熟悉，经常忘记使用某些属性，或者某些属性传递的数据类型有误。因此我们可以在开发React Native自定义组件时，可以通过属性确认来声明这个组件需要哪些属性。这样，如果在调用这个自定义组件时没有提供相应的属性，则会在手机与调试工具中弹出警告信息，告知开发者该组件需要哪些属性。
注意：为了保证React Native代码高效运行，属性确认仅在开发环境中有效。也就是说，正式发布的App运行时是不会进行检查的。
2）、进入项目根目录，执行如下代码安装prop-types库：
yarn add prop-types
3)、在需要使用的JS文件中使用如下代码引入：
import PropTypes from 'prop-types';
二、属性确认的语法
1、要求属性是指定的JavaScript基本类型
属性: PropTypes.array,
属性: PropTypes.bool,
属性: PropTypes.func,
属性: PropTypes.number,
属性: PropTypes.object,
属性: PropTypes.string,
2、要求属性是可渲染的节点
属性:PropTypes.node,
3、要求属性是某个React元素
属性：PropTypes.element,
4、要求属性是某个指定类的实例
属性：PropTypes.instanceOf(NameOfAClass),
5、要求属性取值为特定的几个值
属性：PropTypes.oneOf(['value1' , 'value2'] ),
6、要求属性为指定类型中的一个
属性：PropTypes.oneOfType([
PropTypes.bool,
PropTypes.number,
PropTypes.instanceOf(NameOfAClass),
])
7、要求属性为指定类型的数组
属性: PropTypes.arrayOf(PropTypes.number),
8、要求属性是一个有特定成员变量的对象
属性: PropTypes.objectOf(PropTypes.number),
9、要求属性是一个指定构成方式的对象
属性: PropTypes.shape({
color: PropTypes.string,
fontSize: PropTypes.number,
}),
10、属性可以是任意类型
属性: PropTypes.any
三、将属性声明为必需的
上面描述的 10 种语法，都可以通过在后面加上 isRequired 声明它是必需的。
属性: PropTypes.array.isRequired,
属性: PropTypes.any.isRequired,
属性: PropTypes.instanceOf(NameOfAClass).isRequired,
四、示例
自定义NavigationBar中有部分使用，可以借鉴
网友评论