react设置默认props及props数据类型

在react中父组件往子组件传值通过props属性，为了确保子组件不因props错误导致出错，因此需要对props进行一些初始化设置。

使用prop-types设置props类型

实例代码：

import React, {Component} from 'react';
import PropTypes from 'prop-types';

const defaultProps = {
	name: '',
	age: 0,
	sex: '未知',
	list: []
};

class Test extends Component {
	// ...
}

Test.defaultProps = defaultProps;	// 设置默认props
// 设置props参数类型
Test.propTypes = {
	name: PropTypes.string,
	age: PropTypes.number,
	sex: PropTypes.string,
	list: PropTypes.array
};

export default Test;

prop-types可以检测的数据类型

	// 设置简单数据类型
	optionalArray: PropTypes.array,
	optionalBool: PropTypes.bool,
	optionalFunc: PropTypes.func,
	optionalNumber: PropTypes.number,
	optionalString: PropTypes.string,
	optionalSymbol: PropTypes.symbol,
	
	// 设置枚举类型：你可以把属性限制在某些特定值之内
    optionalEnum: PropTypes.oneOf(['News', 'Photos']),	
	// 设置多个类型：你也可以把属性类型限制在某些指定的类型范围内
    optionalUnion: PropTypes.oneOfType([
        PropTypes.string,
        PropTypes.number,
        PropTypes.instanceOf(Message)
    ]),

	// 设置数组元素类型
	numLists: PropTypes.arrayOf(PropTypes.number),
	
	// 设置对象
	optionalObjectOf: PropTypes.objectOf(PropTypes.number), //指定为某一类型
	optionalObjectWithShape: PropTypes.shape({				// 指定对象属性为不同的类型
        optionalProperty: PropTypes.string,
        requiredProperty: PropTypes.number.isRequired
    }),
    
	// 设置对象数组
	arrList: PropTypes.arrayOf(PropTypes.shape({    // 对象数组
        name: PropTypes.string,
        age: PropTypes.number.isRequired            // 必须存在的数据
    })),
    
	// 设置是否为某个对象的实例
	optionalMessage: PropTypes.instanceOf(Message),