微信小程序js文件改變參數(shù)并在視圖上及時更新【推薦】
更新時間:2018年06月11日 16:47:46 作者:雅玲啞鈴
這篇文章主要介紹了微信小程序js文件改變參數(shù)并在視圖上及時更新的實現(xiàn)代碼,本文給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友參考下吧
用過VUE的童鞋都知道,vue在改變data里面參數(shù)可以以直接用this.XXX=XXX,并且視圖層也會立即更新呈現(xiàn),但是這里我想介紹一下微信小程序是怎樣操作data里面參數(shù)并在視圖層及時更新的
一、簡單參數(shù)
XX.wxml
<view> <text>{{str}}</text> </view> <button bindtap="change">改變</button>
XX.js
Page({ data: { str:'早上好' }, change: function() { this.setData({ str:"晚上好" }) } })
二、已知下標的數(shù)組
XX.wxml
<view> <text>{{array[0].text}}</text> </view> <button bindtap="change">改變</button>
XX.js
Page({ data: { array: [{text: '早上好'}], }, change: function() { this.setData({ 'array[0].text':'晚上好' }) } })
三、動態(tài)下標的數(shù)組
XX.wxml
<view> <block wx:for="array" wx:key="index"> <text>{{item.text}}</text> <button bindtap="change" data-index="index">改變</button> </block> </view> <button bindtap="change">改變</button>
XX.js
Page({ data:{ array:[ {text:'1111'}, {text:'2222'}, {text:'3333'} ] }, change:function(e){ let param = {}; let string = "array["+e.target.dataset.index+"].text; param[string] = '0000'; this.setData(param); } })
總結(jié)
以上所述是小編給大家介紹的微信小程序js文件改變參數(shù)并在視圖上及時更新,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
用最通俗易懂的代碼幫助新手理解javascript閉包 推薦
我同樣也是個javascript新手,怎么說呢,先學的jquery,精通之后發(fā)現(xiàn)了javascript的重要性,再回過頭來學javascript面向?qū)ο缶幊?/div> 2012-03-03最新評論