gpt4 book ai didi

react-native - 我如何在 react-native 中点击图像时实现 Like Unlike 功能?

转载 作者:行者123 更新时间:2023-12-04 10:06:52 24 4
gpt4 key购买 nike

当我要点击图片时,点击后只有一次图片会改变,我无法改变图片。

所以我想知道如何实现这个功能,就像在 react-native 中不同。我是 react-native 的新手,所以请帮助我如何实现这个功能。谢谢你。

enter image description here

下面是一些代码,便于理解

selectLike = (type) => {
if(type==1){
this.setState({like:'Unlike',likeType:1})
}
}

<TouchableOpacity onPress={() => { this.selectLike(1) }}>

{this.state.likeType===1 ?
<View>
<Image source={require('../../Images/redheart.png')} style={styles.imagetriple} />
<Text style={styles.texttriple}>{this.state.like}</Text>
</View>
:
<View>
<Image source={require('../../Images/heart.png')} style={styles.imagetriple} />
<Text style={styles.texttriple}>{this.state.like}</Text>
</View>
}

</TouchableOpacity>

最佳答案

这样试试,喜欢的是true or false

state = {
like: 'Unlike',
liked: false
}
selectLike = () => {
this.setState(prevstate => {
return {
...prevstate,
like: (prevstate.liked ? 'Unlike' : 'like'), liked: !prevstate.liked
}
})
}

}

<TouchableOpacity onPress={this.selectLike}>
{this.state.liked ?
<View>
<Image source={
require('../../Images/redheart.png')
} style={
styles.imagetriple
}
/> <Text style={
styles.texttriple
} > {this.state.like} </Text> </View> :
<View>
<Image source={
require('../../Images/heart.png')
} style={
styles.imagetriple
}
/> <Text style={
styles.texttriple
}> {
this.state.like
} </Text> </View>
}

</TouchableOpacity>

关于react-native - 我如何在 react-native 中点击图像时实现 Like Unlike 功能?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61541387/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com