我只是在学习React-native,但我相信我理解了它的基础知识,这里我的风格将颜色应用于字符和图标(来自字体,因此包含在组件中的另一个字符) .
当我编辑并保存描述该组件的文件时,一切都很完美,但是重新加载 styles.countIcon
的颜色会丢失并变黑 .
import React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import RideTimeIcon from './icons/RideTimeIcon';
export default class RiderCount extends React.Component {
render() {
return(
<View style={{flex: 1, flexDirection: 'row'}}>
<Text style={[
{
fontSize: this.props.fontSize ? this.props.fontSize : 24,
fontWeight: 'bold',
paddingRight: 3
},
styles.countIcon
]}>
{this.props.count ? this.props.count : 0}
</Text>
<RideTimeIcon icon='person' size={this.props.size} style={styles.countIcon} />
</View>
);
}
}
styles = StyleSheet.create({
countIcon: {
color: '#878787' //should be #656565 for black, 878787 white
}
})
看起来我重新加载应用程序或更改除组件之外的其他文件时,countIcon样式就会消失 .
打破它的commit不是我使用的,我在Android设备和模拟器上测试的结果相同:
"expo": "^31.0.2",
"html-entities": "^1.2.1",
"react": "16.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-31.0.0.tar.gz",
"react-native-action-button": "^2.8.5",
"react-native-webview-leaflet": "^4.0.4",
"react-navigation": "^2.18.2"
1 回答
经过一番进一步的探索,我发现我已经习惯了
styles = StyleSheet.create(...)
代替
const styles = StyleSheet.create(...)
.改变它应该解决问题 .