uniapp——点赞、取消点赞

案例

更新点赞状态,而不是每次都刷新整个列表。避免页面闪烁,提升用户体验
在这里插入图片描述

代码

<view class="funcBtn zan" @click="onZan(index,item.id)">
	<image src="/static/images/circle/zan.png" mode="aspectFill"
		v-if="!item.like_status"></image>
	<image src="/static/images/circle/zan2.png" mode="aspectFill"
		v-if="item.like_status"></image>
	<view class="nums">{{item.like_num}}</view>
</view>
// 点赞
function onZan(index, likeId) {
	if (list.value[index].like_status) {
		list.value[index].like_status = false
		list.value[index].like_num--
		likeImport(likeId)
	} else {
		list.value[index].like_status = true
		list.value[index].like_num++
		likeImport(likeId)
	}
}
//接口
function likeImport(likeId) {
	api.getLikeSave({
		release_id: likeId
	}).then(res => {
		if (res.code == 1) {

		}
	})
}

相关推荐

  1. uniapp 实现双击出现特效

    2024-05-09 13:32:05       50 阅读
  2. 用c语言写一个抖音系统

    2024-05-09 13:32:05       48 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-05-09 13:32:05       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-05-09 13:32:05       106 阅读
  3. 在Django里面运行非项目文件

    2024-05-09 13:32:05       87 阅读
  4. Python语言-面向对象

    2024-05-09 13:32:05       96 阅读

热门阅读

  1. 19、Flink 的 State Backends 配置详解

    2024-05-09 13:32:05       24 阅读
  2. Ubuntu CMake升级

    2024-05-09 13:32:05       33 阅读
  3. 2024.5.8 LeetCode 刷题记

    2024-05-09 13:32:05       35 阅读
  4. 使用 PhotoRec 恢复磁盘丢失文件

    2024-05-09 13:32:05       30 阅读
  5. pat乙1029-旧键盘

    2024-05-09 13:32:05       38 阅读
  6. VPN 服务器通俗理解

    2024-05-09 13:32:05       37 阅读
  7. 设计模式——组合模式(Composite)

    2024-05-09 13:32:05       38 阅读