案例
更新点赞状态,而不是每次都刷新整个列表。避免页面闪烁,提升用户体验
代码
html
<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>
javascript
// 点赞
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) {
}
})
}