ReactNative 自定義元件
阿新 • • 發佈:2021-07-21
定義屬性
import PropTypes from 'prop-types' static propTypes = { title:PropTypes.string.isRequired,// 必選 titleColor:PropTypes.any, onPress:PropTypes.func, selected:PropTypes.bool, icon:PropTypes.any } static defaultProps = { titleColor:'#4b4b4f',//可選預設值 onPress:undefined, selected:false, icon:"" }
render() { return ( <TouchableOpacity activeOpacity={0.5} style={[styles.container]} onPress={this.onPress}> <View > <View style={[styles.imageBg,{backgroundColor:this.props.selected?'#45bfbc':'transparent'}]}> <Image source={this.props.icon} style={{width:22,height:22}} resizeMode='contain'></Image> </View> <Text style={[styles.text,{color:this.props.titleColor}]}>{this.props.title}</Text> </View> </TouchableOpacity> ); }