vue评论点赞列表点赞，点击哪个哪个状态改变

后台数据如下：
{
“body”:{
“host”:null,
“code”:200,
“errorMessage”:null,
“data”:[
{
“accountId”:“1”,
“commentId”:“2”,
“headPortrait”:“http://qiniu.yibaimishenghuo.com/1612603455(1)_1613700243471.jpg”,
“nickname”:“222”,
“created”:“2021-03-02 19:21:00”,
“content”:“22222”,
“likes”:0,
“isLike”:false
},
{
“accountId”:“1”,
“commentId”:“1”,
“headPortrait”:“http://qiniu.yibaimishenghuo.com/1612603455(1)_1613700243471.jpg”,
“nickname”:“222”,
“created”:“2021-03-02 19:20:50”,
“content”:“11111”,
“likes”:0,
“isLike”:false
},
{
“accountId”:“1364171838251044866”,
“commentId”:“3”,
“headPortrait”:null,
“nickname”:"",
“created”:“2021-03-02 19:21:12”,
“content”:“33333”,
“likes”:0,
“isLike”:false
}
],
“currentPage”:1,
“size”:10,
“total”:3
},
“statusCode”:200
}
代码如下：

<div class="flex" v-for="(vv,index) in commentList"><div class="touxiang"><img class="img" :src="vv.headPortrait" alt=""></div><div class="padd-left"><div class="flex-between"><div class="aui-font-size-18">{{vv.nickname}}</div><div class="flex-czjz" @click="commentLike(vv.isLike,vv.commentId,index)"><img :src="vv.isLike?'../../image/zan1.png':'../../image/zan0.png'" style="width: 0.9rem;height: 0.9rem;object-fit:contain;"><span class="padd-left">{{vv.likes}}</span></div></div><div class="aui-text-grayer">{{vv.created}}</div><div>{{vv.content}}</div></div>
</div>
//isLike是否点过赞了，
//commentId：评论每一条的列表id,
//index:当前索引commentLike: function(isLike,commentId, index) {if (isLike) {vm.type = 2;} else {vm.type = 1;}Ajax({method: 'POST',url: 'comment/like',token: api.getPrefs({sync: true,key: 'token'}),data: {id: commentId,type: vm.type},success: function(ret) {if (ret.code == 200) {if (isLike) {vm.commentList[index].likes--;vm.commentList[index].isLike=false;mineAlert("取消点赞")} else {vm.commentList[index].likes++;vm.commentList[index].isLike=true;mineAlert("已点赞")}} else if (ret.code == 201) {backToLogin();} else {mineAlert(ret.msg)}}});},

vue评论点赞列表点赞，点击哪个哪个状态改变相关推荐

el-checkbox的坑（点击全选状态改变了但是不生效）
正常绑定下的el-checkbox可以改变数据,但是如果在el-checkbox-group下的el-checkbox,要实现全选就必须控制el-checkbox-group下的v-model绑定的数 ...
全栈项目|小书架|微信小程序-登录回调及获取点赞列表功能
效果图这一节介绍,登录回调以及喜欢列表的实现. 登录回调:这里是指在获取登录完成之后,再进行下一步的操作. 比如效果图中我的页面,默认是未登录状态,积分和喜欢列表的数量都没有获取到. 而登录成 ...
使用JavaScript实现B站评论区自动点赞工具的思路
JavaScript是什么? JavaScript是跨平台.面向对象的 Web编程脚本语言.绝大多数网站都使用JavaScript,所有现代Web浏览器(无论是桌面.平板还是手机浏览器)都包含Java ...
如何用python实现一个简单的自动评论，自动点赞，自动关注脚本？
今天的这个脚本, 是一个别人发的外包, 交互界面的代码就不在这里说了, 但是可以分享下自动评论.自动点赞.自动关注.采集评论和视频的数据是如何实现的开发环境 python 3.8 运行代码 pych ...
mysql表点赞实现_小程序实现列表点赞功能
最近在开发一个小程序,想添加一个点赞功能,那到底怎么实现呢?因为要和后台服务器同步数据,所以这个我想了好几天应该怎么实现点赞和取消点赞的逻辑,经过两天的实践调试,最终实现了. 思路如下: 1.找到对应 ...
【GT-安卓应用开发之点赞列表实现】
前言:今天闲来无事想到了刚接触安卓不久的时候特别感兴趣的一个东西,那就是自定义View属性.恰巧今天闲来无事,就写一个简单的类似于朋友圈点赞列表的小程序. 我的思路是这样的:点赞列表采用流式布局,由于 ...
小程序之列表点赞功能的实现
最近在开发一个小程序,想添加一个点赞功能,那到底怎么实现呢?因为要和后台服务器同步数据,所以这个我想了好几天应该怎么实现点赞和取消点赞的逻辑,经过两天的苦逼实践调试,最终实现了(真的好累啊). 思路如 ...
基于微信小程序的用户列表点赞功能
代码地址如下: http://www.demodashi.com/demo/13997.html 一.前言 (1).适合人群 1.微信小程序开发者 2.前端工程师 3.想入门学习小程序开发的人员 4. ...
微信小程序点赞+取消点赞多项点击
小菜鸟一个,希望各位大神不要往死喷,小弟这里先谢过了最近接触到小程序,发现很有意思,在项目中遇到了一点小问题,就是点赞+取消点赞有些冲突,还有就是多项的点击,话不多说咱们直接上代码!!!!! 效果图 ...

vue评论点赞列表点赞，点击哪个哪个状态改变

vue评论点赞列表点赞，点击哪个哪个状态改变

vue评论点赞列表点赞，点击哪个哪个状态改变相关推荐

最新文章

热门文章