效果"/>
Vue【列表页app】-点赞与取消点赞效果
Vue【列表页app】-点赞与取消点赞效果
第一步:【template】
第二步:【js】定义
第三步:【methods里面创建function判断】
【代码】
<template><view><view class="likeimg" @tap="like"><image v-if="isClick==0" class="likeimage" style="color: #30D4F5;" src="../../static/like.png"></image><image v-if="isClick==1" class="likeimage" style="color: #30D4F5;" src="../../static/like1.png"></image></view><view class="clicknum">{{clickNum}}</view></view>
</template><script>export default{data() {return {clickNum:12,isClick:''}},methods:{like:function(){if(this.isClick==0){this.isClick=1this.clickNum=this.clickNum+1console.log(this.clickNum)}else{this.isClick=0this.clickNum=this.clickNum-1}}}}</script><style></style>
【注意:】如有涉及到连接后台接口问题,可在methods进行需求的修改。OK啦,希望对需要的小伙伴有所帮助
更多推荐
Vue【列表页app】-点赞与取消点赞效果
发布评论