微信小程序之this.setData

setData 函数用于将数据从逻辑层发送到视图层,同时改变对应的 this.data 的值。

注意:

  1. 直接修改 this.data 无效,无法改变页面的状态,还会造成数据不一致。
  2. 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。

setData() 参数格式

接受一个对象,以 key,value 的形式表示将 this.data 中的 key 对应的值改变成 value。

其中 key 可以非常灵活,以数据路径的形式给出,如 array[2].messagea.b.c.d,并且不需要在 this.data 中预先定义。

微信小程序之this.setData
Page({ data: { text: init data, array: [{text: init data}], object: { text: init data } }, changeText: function() { // this.data.text = ‘changed data‘ // bad, it can not work this.setData({ text: changed data }) }

也可以保持不变直接传到视图层:

Page({ data: { list:[ { id:view, name:视图容器, open:false, pages:[view,scroll-view,swiper] },{ id:content, name:基础内容, open:false, pages:[text,icon,progress] },{ id:form, name:表单组件, open:false, pages:[button,checkbox,form,input,label,picker,radio,slider,switch,textarea] },{ id:nav, name:导航, open:false, pages:[navigator] },{ id:media, name:媒体组件, open:false, pages:[image,audio,vodeo] },{ id:map, name:地图, pages:[map] },{ id:canvas, name:画布, pages:[canvas] } ] }, kindToggle:function(e){ var id = e.currentTarget.id,list = this.data.list; for(var i =0,len = list.length;i<len;++i){ if(list[i].id ==id){ list[i].open = !list[i].open }else{ list[i].open = false } } this.setData({ list:list }) } })

 

相关文章