微信小程序 setData 對 data數(shù)據(jù)影響問題
我是純前端的,有些時(shí)候沒有后端接口,只能模擬一些數(shù)據(jù)來操作。偶然之下,發(fā)現(xiàn)了setdata 的一些機(jī)制,也有可能不對,請多指教。
先放結(jié)論:data的變量通過setdata綁在一起,是同步變化的
準(zhǔn)備做一個(gè)一鍵還原界面的按鈕事件,如果有后端接口,只需調(diào)一下接口,就可以了。問題是沒有,于是想弄兩個(gè)一模一樣的數(shù)組A,B;A用來渲染界面,一鍵還原的時(shí)候,就把B的值賦給A,從而引起頁面重新渲染,達(dá)到重置界面的效果。
結(jié)果一點(diǎn)反應(yīng)也沒有。
data里有模擬的數(shù)組 itemleft itemright,二選一,
定義代碼是這么寫的
this.setData({
uniqueitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
cloneitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
baninput: (id == 'unfinish')?false:true
})
這是一鍵還原的代碼
this.setData({
uniqueitem:this.data.cloneitem
})
后來通過console.log發(fā)現(xiàn) uniqueitem、cloneitem和this.data.itemleft[index] 的值是一模一樣的,意思是,當(dāng)我改變uniqueitem的時(shí)候,其他兩個(gè)都會跟著變。
然后,我把cloneitem的值通過緩存還獲取,代碼變成了這樣
this.setData({
uniqueitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
baninput: (id == 'unfinish')?false:true
})
var that=this
wx.getStorage({
key: 'item',
success: function(res) {
console.log(res)
that.setData({
cloneitem:res.data
})
},
})
this.setData({
uniqueitem:this.data.cloneitem
})
改成這樣之后,一鍵還原第一次正常,后面再點(diǎn)全不正常
這是測試的console順序
console.log(this.data.itemleft[0]) console.log(this.data.uniqueitem) console.log(this.data.cloneitem)
事先說明,改變date,改的是2的date
我通過一個(gè)函數(shù)改變了date,加1,
可以看到 1和2同時(shí)改變,3不變;
一鍵還原第一次
可以看到,1不變,3的值賦給了2;到目前正常
再次改變date,
可以看到,2和3一起變,1不變了
一鍵還原
和上面一樣不變了
后來我改成
var aaa = this.data.cloneitem;
this.setData({
uniqueitem:aaa
})
效果和上面一樣。
結(jié)論,
當(dāng)data有3個(gè)變量,a和b、c
this.setData({
a:this.data.b
c:this.data.b
})
意思是,a和b綁一起,c和b綁一起,3個(gè)一起變,改變一個(gè)等于改變3個(gè)。個(gè)人猜測,應(yīng)該是存放變量a,b,c 的地址變成一個(gè)了。
this.setData({
a:this.data.b
})
a和b一起變。
this.setData({
a:this.data.c
})
a不和b一起變,和c一起變。
簡而言之,data的變量通過setdata綁在一起,是同步變化的,要小心。
總結(jié)
以上所述是小編給大家介紹的微信小程序 setData 對 data數(shù)據(jù)影響問題,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時(shí)回復(fù)大家的!
相關(guān)文章
JavaScript語法高亮插件highlight.js用法詳解【附highlight.js本站下載】
這篇文章主要介紹了JavaScript語法高亮庫highlight.js用法,詳細(xì)分析了highlight.js的下載、調(diào)用及具體使用技巧,需要的朋友可以參考下2016-11-11
Bootstrap實(shí)現(xiàn)的標(biāo)簽頁內(nèi)容切換顯示效果示例
這篇文章主要介紹了Bootstrap實(shí)現(xiàn)的標(biāo)簽頁內(nèi)容切換顯示效果,結(jié)合完整實(shí)例形式分析了基于Bootstrap實(shí)現(xiàn)的標(biāo)簽頁內(nèi)容切換顯示功能相關(guān)操作技巧,非常簡單實(shí)用,需要的朋友可以參考下2017-05-05
Boostrap模態(tài)窗口的學(xué)習(xí)小結(jié)
Bootstrap Modals(模態(tài)框)是使用定制的 Jquery 插件創(chuàng)建的。它可以用來創(chuàng)建模態(tài)窗口豐富用戶體驗(yàn),或者為用戶添加實(shí)用功能。您可以在 Modals(模態(tài)框)中使用 Popover(彈出框)和 Tooltip(工具提示插件)2016-03-03
electron獲取位置坐標(biāo)信息的方法小結(jié)
這篇文章給大家詳細(xì)介紹了electron 如何獲取位置坐標(biāo)信息,文中通過代碼示例給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2024-02-02
簡單實(shí)現(xiàn)JS倒計(jì)時(shí)效果
這篇文章主要教大家如何簡單實(shí)現(xiàn)JS倒計(jì)時(shí)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12
JS操作input標(biāo)簽屬性checkbox全選的實(shí)現(xiàn)代碼
這篇文章主要介紹了JS操作input標(biāo)簽屬性checkbox全選的代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03
js當(dāng)一個(gè)變量為函數(shù)時(shí) 應(yīng)該注意的一點(diǎn)細(xì)節(jié)小結(jié)
變量testFun為一個(gè)匿名函數(shù),匿名函數(shù)返回的一個(gè)testFun.init對象(也是一個(gè)匿名函數(shù))2011-12-12
JavaScript計(jì)算兩個(gè)日期時(shí)間段內(nèi)日期的方法
這篇文章主要介紹了JavaScript計(jì)算兩個(gè)日期時(shí)間段內(nèi)日期的方法,涉及javascript操作時(shí)間的技巧,需要的朋友可以參考下2015-03-03

