Vue之点击收藏与取消收藏
思路通过条件运算符,给定图片一个属性,点击改变属性值未点击时,图标灰,默认值false点击时,图标亮,改变为true再次点击时,图标灰,改为false示例<div><img :src="isActive===true?'static/image/c_icon1.png':'static/image/c_icon.png'"@click="gostore"></div&
·
思路
通过条件运算符,给定图片一个属性,点击改变属性值
- 未点击时,图标灰,默认值false
- 点击时,图标亮,改变为true
- 再次点击时,图标灰,改为false
示例
<div>
<img :src="isActive===true?'static/image/c_icon1.png':'static/image/c_icon.png'"
@click="gostore">
</div>
methods: {
gostore(){ //收藏
const that=this;
if(that.isActive === false){
//axios请求
that.isActive = true
console.log("aa")
}else if(that.isActive === true){
//axios请求
that.isActive = false
console.log("bb")
}
},
}
更多推荐
已为社区贡献8条内容
所有评论(0)