Page.prototype.setData(Object data, Function callback)
callback:(setData引起的界面更新渲染完毕后的回调函数)
setData 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）
1、设置数据
可以设置一个或同时多个data数据
this.setData({
test:'hello world!',
info:'data',
})
console.log(this.data.test) // 结果 =》 “hello world!”
console.log(this.data.info) // 结果 =》“data”
2、用setData() 设置/修改 对象或数组 里某个属性的值 & 动态设置值
比如修改 下面 medias 对象里 id的值
①key必须带引号
page({
data:{
medias:{id:"666",name:"test"}，
},
changeData :function(){
this.setData({
"medias.id"："999” //key必须带引号
})
console.log(this.data.medias.id) // 结果 =》 “999”
}})
②先将 key值用变量保存 ，key值使用时 用[ ]引起来
page({
data:{
medias:{id:"666", name:"test"}
},
changeData :function(){
var media=“medias.id” ; //先将 key值用变量保存
this.setData({
[media]：“999” // key值使用时 用[ ]引起来
})
console.log(this.data.medias.id) // 结果 =》 “999”
}
})
3⃣️ 动态index 修改data
Page({
data: {
dataList: [{
subTitle: "【冰鲜】马鲛鱼",
details: "500g～600g/条 1000g130元",
count: 2,
},
{
subTitle: "【冰鲜】秋刀鱼",
details: "400g～500g/条 1000g80元",
count: 3,
}]
},
bindReduce(e) {
var index = e.target.dataset.index;
//点击事件从 wxml 获取自定义属性index 用于判断是修改数组中第几个元素的数量
var count = 'dataList[' + index + '].count'
this.setData({
[count]: this.data.dataList[index].count -1
})
}
});
四 不同input 绑定同一个事件 通过 传type 做不同的状态更新
<view class="container">
<view>
<label>姓名</label><input bindinput='changeValue' value="{{name}}" data-type="name"></input>
</view>
<view>
<label>手机号</label>
<input type="number" bindinput='changeValue' value="{{phone}}" data-type="phone"> </input>
</view>
</view>
changeValue(e){
var value = e.detail.value;
var type = e.currentTarget.dataset.type;
this.setData({
[type]: value
})
console.log('name',this.data.name)
console.log('phone', this.data.phone)
}
