模拟朋友圈实时点赞及评论功能
点赞思路:点击的时候,使用push(点赞)以及slice(取消赞)方法处理数组,并且调用点赞接口
评论思路:点击的时候,写多一个评论列表,当点击发送的时候commentStatus=true,且索引等于点击的索引。同时调用获取评论列表的接口
html
<view class="toolbar">
<view class="timestamp">{{item.timetype}}</view>
<!-- 点赞 如果islove==1,图片变为点赞的图片-->
<view class="like" @tap="like(index,item.id)">
<image :src="/UploadFiles/2021-04-02/item.islove==1">
// 点赞
like(index,communityId) {
if (this.community[index].islove == 0) {
this.community[index].islove = 1;
this.community[index].lovelist.push(
{name:this.userinfo.nickname,vipid:this.userinfo.id}
)
this.likeImport(communityId)
} else {
this.community[index].islove = 0;
this.community[index].lovelist.splice(this.community[index].lovelist.indexOf(this.userinfo.nickname), 1)
this.likeImport(communityId)
}
},
// 点赞接口
likeImport(id) {
app.vipidRequest({
url: 'Vip/community_love',
data: {
id: id
},
header: {
'content-type': 'application/x-www-form-urlencoded',
},
method: 'POST',
success:(res) => {
if(res.data.status) {
} else {
console.log(res.data)
}
}
})
},
// 点击评论
comment(index,communityId) {
this.showInput = true; //调起input框
this.focus = true; // 对焦
this.communityId = communityId
},
// 点击发送
send_comment: function(message) {
this.commentStatus = true
this.commentIndex = index
this.realtimecontent = message.content
this.realtimename = this.userinfo.nickname
app.vipidRequest({
url: 'Vip/community_on',
data: {
id: this.communityId,
content: message.content,
type: 1
},
header: {
'content-type': 'application/x-www-form-urlencoded',
},
method: 'POST',
success:(res) => {
if(res.data.status) {
this.getCommunity() // 整个页面数据刷新
this.init_input()
this.commentStatus = false // 临时渲染评论的列表隐藏
this.realtimecontent = ''
this.realtimename = ''
this.input_placeholder = '评论';
} else {
console.log(res.data)
}
}
})
}
// 取消评论/评论完成输入框状态值
init_input() {
this.showInput = false;
this.focus = false;
this.input_placeholder = '评论';
this.is_reply = false;
},
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
暂无“uni-app实现点赞评论功能”评论...
更新动态
2025年11月03日
2025年11月03日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]