3.4 修改页面的data

Page.prototype.setData(Objectdata,Functioncallback)
setData函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的this.data的值(同步)。
参数说明
字段   类型   必填   描述   最低版本
data   Object   是   这次要改变的数据   
callback   Function   否   setData引起的界面更新渲染完毕后的回调函数   1.5.0
Object以key:value的形式表示,将this.data中的key对应的值改变成value。
其中key可以以数据路径的形式给出,支持改变数组中的某一项或对象的某个属性,如array[2].message,a.b.c.d,并且不需要在this.data中预先定义。

注意:
直接修改this.data而不调用this.setData是无法改变页面的状态的,还会造成数据不一致。
仅支持设置可JSON化的数据。
单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。
请不要把data中任何一项的value设为undefined,否则这一项将不被设置并可能遗留一些潜在问题。

示例代码:
< !--index.wxml-->
<view>
    {{text}}
</view>
<button bindtap="changeText">Changenormaldata</button>
<view>
    {{num}}
</view>
<button bindtap="changeNum">Changenormalnum</button>
<view>
    {{array[0].text}}
</view>
<button bindtap="changeItemInArray">ChangeArraydata</button>
<view>
    {{object.text}}
</view>
<button bindtap="changeItemInObject">ChangeObjectdata</button>
<view>
    {{newField.text}}
</view>
<button bindtap="addNewField">Addnewdata</button>
下面是对应的js文件
Page({
    data:{
        text:'init data',
        num:0,
        array:[
            {
                text:'init data'
            }
        ]
        ,object:{
            text:'init data'
        }
    },
    changeText:function(){
        //this.data.text='changed data'//不要直接修改this.data
        //应该使用setData
        this.setData({
            text:'changed data'
        })
    },
    changeNum:function(){
        //或者,可以修改this.data之后马上用setData设置一下修改了的字段
        this.data.num=1 this.setData({
            num:this.data.num
        })
    },
    changeItemInArray:function(){
        //对于对象或数组字段,可以直接修改一个其下的子字段,这样做通常比修改整个对象或数组更好
        this.setData({
            'array[0].text':'changed data'
        })
    },
    changeItemInObject:function(){
        this.setData({
            'object.text':'changed data'
        });
    },
    addNewField:function(){
        this.setData({
            'newField.text':'new data'
        })
    }
})