uniapp個人踩坑記錄-支付寶小程序篇

功能需求:使用v-for遍歷數組,添加點擊事件使點擊到的元素添加active樣式,如圖

數據:
qg_array = [
    {current:false,name:1,b:2,id:1},
    {current:false,name:2,b:2,id:2},
    {current:false,name:3,b:2,id:3},
].
問題:點擊按鈕後樣式沒有變化
過程:
        1、會不會是代碼問題,會不會是語法出現錯誤?但是經過排查並在微信小程序&百度小程序正常運行,排除了這個可能性;

        2、是不是兼容性問題,官方有沒有文檔指出這個?通過一頓操作官網、百度、加uni的qq羣資詢,都沒有找到明文說明(小聲bb:甚至都沒找到關於這個bug的相關提問,是我出這個問題是特例嗎?還是社區不成熟?)。

        3、會不會是數據已經改變,但是模板渲染時沒有拿到最新數據,也就是說當uni的vue語法編譯成支付寶小程序時不夠兼容,導致數據雙向綁定的實時更新失敗呢?經過打印日誌debugger查詢,最終確定這個猜想成立,qg_array數據確實已經改變,但是v-for渲染沒有即時更新。
            3.1、那麼又拋出一個問題,那我對修改後的數據做一次賦值qg_array=[...qg_array]會不會達成目的?答案是否。。
            3.2、那麼既然這樣我就新建一個臨時數組 tempArr來存放試試?tempArr:[] 當點擊事件完成進行賦值this.tempArr=[...this.qg_array],然後通過判斷tempArr中current修改樣式。結果成功


個人結論:支付寶小程序對於v-for遍歷的數據存在一定的兼容性,所以會存在對於動態修改數組中對象的屬性後,不能即時更新(但是tempArr又即時更新了,那麼是哪個環節出了問題呢?下次遇到再解決,下次一定.jpg)


我的解決方式:新建一個臨時數組qg_tempArray = [...qg_array]作爲判斷依據,由原本判斷qg_array[index].current來添加類名改爲判斷qg_tempArray[index].current.
最終效果圖:


(o゜▽゜)o☆[BINGO!] 成功

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章