我正在尝试获取heartIconColor要在我的子组件中使用的变量。但我收到一个错误。我怎样才能让这个变量成为图标的颜色？
参考错误：找不到变量：heartIconColor
我的 app.js
export default class Home extends Component {
constructor(props){
super(props);
this.state = {
liked: false
}
}
likePost = (author, id) => {
alert("Liked!!" + author + id)
this.liked()
}
liked(){
this.setState({
liked: !this.state.liked
})
}
renderItem = ({ item, index }) => {
return (
<Post
like={this.likePost}
liked={this.state.liked}
/>
)
}
render() {
const heartIconColor = this.state.liked ? "red" : null;
return (
<FlatList data={this.state.getData} renderItem={this.renderItem}>
</FlatList>
)
}
我的组件：
const Post = (props) => {
const styles = StyleSheet.create({
heartIcon: {
fontSize: 20,
color: heartIconColor,
}
})
return (
<View style={styles.flex}>
<Text><Icon onPress={() => onClick={this.props.like}} style={styles.heartIcon} type="Octicons" name="heart" /></Text>
</View>
)
}
export { Post };
您可以将图标颜色设为
const styles = StyleSheet.create({
heartIcon: {
fontSize: 20,
color: props.liked ? "red" : null,
}
})
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句