vue 列表 点赞/评论 局部刷新

在遍历数据时 前端手动增加字段用来暂存点赞或刷新的数据

this.list.forEach(element => {
	 if(!element.Praise){  //点赞数量
	     element.Praise = {Count:0,Data:[]}
	 }
	 if(!element.Comment){  //评论数量及内容
	     element.Comment = {Count:0,Data:[]}
	 }
});

当接口返回成功信息时再进行操作，可以保证前端和数据库的数据是一致的

praise(item,bool){
     PraiseMQ({data}).then(res => {
         if(!res.iserror){
             if (bool) {
                 item.PraiseDone = true
                 item.Praise.Count += 1
                 // Toast('点赞成功')
             } else {
                 item.PraiseDone = false
                 item.Praise.Count -= 1
             }
         }else{
             Toast(res.errormsg)
         }
     })
 },
Comment({data}).then(res => {
    if(!res.iserror){
        Toast('评论成功')
        this.isDiscuss = false
        let obj={
            UserName:res.data.UserName,
            Message:res.data.Message
        }
        this.currentItem.Comment.Data.push(obj)
        this.currentItem.Comment.Count += 1
        this.$forceUpdate()
    }
})