微信小程序?qū)崿F(xiàn)列表頁的點(diǎn)贊和取消點(diǎn)贊功能
今天開發(fā)了一個(gè)文章的留言版塊,于是想到要為某個(gè)留言點(diǎn)贊,點(diǎn)過贊的再次點(diǎn)擊會(huì)取消點(diǎn)贊,代碼如下:
/*更新點(diǎn)贊*/
update_zan:function(e){
var that = this;
var data = e.currentTarget.dataset;
var mid = data.mid;
var cookie_mid = wx.getStorageSync('zan') || [];//獲取全部點(diǎn)贊的mid
var isadd = 1;
var newmessage = [];
if (cookie_mid.includes(mid)){//說明已經(jīng)點(diǎn)過贊,取消贊
isadd = 0;
var m = 0;
for (var j in cookie_mid){
if(cookie_mid[j] != mid){
newmessage[m] = cookie_mid[j];
m++
}
}
wx.setStorageSync('zan', newmessage);//刪除取消贊的mid
}else{
cookie_mid.unshift(mid);
wx.setStorageSync('zan', cookie_mid);//新增贊的mid
}
wx.request({
url: app.globalData.api.api_system,
data: {
action: 'zannum',
mid: mid,
isadd: isadd,
wxid: app.globalData.wxid
},
method: 'GET',
// header: {},
success: function (res) {
var message = that.data.message;
for (var i in message) {
if(message[i].mid == mid){
if(isadd){
message[i].zan = parseInt(message[i].zan) + 1
}else{
message[i].zan = parseInt(message[i].zan) - 1
}
}
}
that.setData({
message: message
})
}
})
重點(diǎn)注意代碼:
(1)要把所有已經(jīng)點(diǎn)過贊的留言id給存儲(chǔ)到本地緩存之中,這樣如果重復(fù)點(diǎn)贊的,就可以判斷出來,并取消點(diǎn)贊,取消點(diǎn)贊的同時(shí)要去掉緩存中的id;
(2)新增點(diǎn)贊和取消點(diǎn)贊用到同一個(gè)api,通過isadd=1或者isadd=0來判斷是新增還是取消點(diǎn)贊
(3)為了不頻繁去讀取留言列表,可以直接調(diào)用this.data.message,并通過循環(huán)遍歷改變某個(gè)留言的點(diǎn)贊數(shù),然后直接重新賦值,就能動(dòng)態(tài)改變點(diǎn)贊數(shù)!
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 微信小程序?qū)崿F(xiàn)點(diǎn)贊業(yè)務(wù)
- 小程序云開發(fā)教程如何使用云函數(shù)實(shí)現(xiàn)點(diǎn)贊功能
- 微信小程序?qū)崿F(xiàn)點(diǎn)贊、取消點(diǎn)贊功能
- 小程序?qū)崿F(xiàn)列表點(diǎn)贊功能
- 小程序點(diǎn)贊收藏功能的實(shí)現(xiàn)代碼示例
- 微信小程序項(xiàng)目總結(jié)之點(diǎn)贊 刪除列表 分享功能
- 微信小程序基于本地緩存實(shí)現(xiàn)點(diǎn)贊功能的方法
- 微信小程序小組件 基于Canvas實(shí)現(xiàn)直播點(diǎn)贊氣泡效果
- 小程序animate動(dòng)畫實(shí)現(xiàn)直播間點(diǎn)贊
相關(guān)文章
配置eslint規(guī)范項(xiàng)目代碼風(fēng)格
這篇文章主要介紹了配置eslint規(guī)范項(xiàng)目代碼風(fēng)格,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-03-03
json對(duì)象轉(zhuǎn)字符串如何實(shí)現(xiàn)
本文將介紹js json對(duì)象與字符串如何實(shí)現(xiàn)轉(zhuǎn)換,有需要的朋友可以參考下2012-12-12
基于BootStrap實(shí)現(xiàn)局部刷新分頁實(shí)例代碼
這篇文章主要介紹了基于BootStrap實(shí)現(xiàn)局部刷新的分頁的相關(guān)資料,非常不錯(cuò),代碼簡單易懂,具有參考價(jià)值,需要的朋友可以參考下2016-08-08
js設(shè)置cookie過期當(dāng)前時(shí)間減去一秒相當(dāng)于立即過期
這篇文章主要介紹了設(shè)置js cookie過期(相當(dāng)于清除瀏覽器對(duì)應(yīng)名稱的cookie)使用方法是當(dāng)前時(shí)間減去一秒相當(dāng)于立即過期2014-09-09
JS字符串累加Array不一定比字符串累加快(根據(jù)電腦配置)
言歸正傳:性能差異較大的機(jī)器運(yùn)行結(jié)果會(huì)RT 出現(xiàn)大的差異,為了保險(xiǎn)起見。還是推薦使用Array 來進(jìn)行字符串拼接操作2012-05-05
微信小程序onLaunch異步,首頁onLoad先執(zhí)行?
這篇文章主要介紹了微信小程序onLaunch異步,首頁onLoad先執(zhí)行? 文章底部給大家介紹了小程序_onLaunch異步回調(diào)數(shù)據(jù)加載問題的兩種解決方案,需要的朋友可以參考下2018-09-09
Bootstrap table表格初始化表格數(shù)據(jù)的方法
這篇文章主要介紹了Bootstrap-table表格初始化表格數(shù)據(jù)的方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-07-07

