1). 安装prop-types
npm install --save prop-types
2). 导入
import PropTypes from 'prop-types';
3). 定义属性
const ImageSourcePropType = require('ImageSourcePropType');
// 在组件中填写
/**
* 属性参数
属性名称: React.PropTypes.array,
属性名称: React.PropTypes.bool,
属性名称: React.PropTypes.func,
属性名称: React.PropTypes.number,
属性名称: React.PropTypes.object,
属性名称: React.PropTypes.string,
*/
static propTypes = {
focused: PropTypes.bool.isRequired,
selectedImage: ImageSourcePropType,
normalImage: ImageSourcePropType
};
4). 完整代码
import React, {PureComponent} from 'react';
import {
Image
} from 'react-native';
// npm install --save prop-types
import PropTypes from 'prop-types';
const ImageSourcePropType = require('ImageSourcePropType');
/**
* @FileName: TabBarItem
* @Author: mazaiting
* @Date: 2018/6/12
* @Description:
*/
class TabBarItem extends PureComponent {
/**
* 属性参数
属性名称: React.PropTypes.array,
属性名称: React.PropTypes.bool,
属性名称: React.PropTypes.func,
属性名称: React.PropTypes.number,
属性名称: React.PropTypes.object,
属性名称: React.PropTypes.string,
*/
static propTypes = {
focused: PropTypes.bool.isRequired,
selectedImage: ImageSourcePropType,
normalImage: ImageSourcePropType
};
render() {
const image = this.props.focused ? this.props.selectedImage : this.props.normalImage;
return (
<Image source={image} style={{tintColor: this.props.tintColor, width: 22, height: 22}}/>
)
}
}
/**
* 导出当前Module
*/
module.exports = TabBarItem;