uniapp小程序实现评论、点赞、删除单个动态功能

效果图预览

实现思路

在微信小程序中提供了setData用来实现数据修改渲染到视图层的效果（即双向绑定），但是uniapp中不支持微信小程序的api，报错this.setData is not a function...然后就选择了使用this.$set。

拿到渲染列表的数据之后，把点赞数量、点赞状态（是否点赞）、评论数量分别以数组的形式存到本地，维护三个数组，当评论、点赞成功之后，利用this.$set修改视图层的数据来实现局部刷新的效果。
同样，删除某条动态也是这种思路，只不过可以不用存到本地，将数组长度设置成动态数量，然后fill成true，删除的话就变成false即可。

// 点赞操作
				like(id,index){
					const data = { id: id };
					thumbUp(data).then(res =>{
						const num = this.thumbUpNums[index]+1;
						this.$set(this.thumbUpNums,index,num);
						this.$set(this.thumbUpStatus,index,true);
					}).catch(e =>{
						console.log(e)
					})
				}

关于this.$set

使用this.$set可以实现更新视图层数据

🌹this.$set( target, key, value )
🌹 target：要更改的数据源(可以是对象或者数组)
🌹 key：要更改的具体数据
🌹 value ：重新赋的值