微信小程序setData用法以及如何修改数组

作者: deepwinter 分类: 前端 发布时间: 2019-06-26 09:52 点击量: 150 次阅读

1. setData说明

小程序中,没有双向数据绑定。
setData函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的this.data的值(同步)。
直接修改this.data而不调用this.setData是无法改变页面的状态的,还会造成数据不一致。
单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。


2. 修改数据

使用setData(),参数是一个key-value形式的对象

Page.prototype.setData();

如果是在此页的.js文件中,可直接使用this

this.setData({
   dataname :value
})

注意:
使用setData修改数据时,不需要在this.data中预先定义,使用setData()方法会自动创建该数据


3. 修改数组

3.1. 添加数组元素

data:{
    arrayTest:[
    {title:"1",val:"one"},
    {title:"2",val:"two"},
    {title:"3",val:"three"}]
}
opationArray(){
    var self = this;
    var obj = {title:"4",val:"four"}
    var arrayT = self.data.arrayTest;
    arrayT.push(obj);
    self.setData({arrayTest:arrayT});
}

3.2. 修改数组中的某条数据

this.setData({
    'list[0].title' = 'change data', //数据路径key必须带''号
    'list[0].num' = 'change data' //数据路径key必须带''号
})

3.3. key值可以为变量,为变量的时候要用[ ]引起来

page({
  data:{
    todos:[{id:0,text:'abc',isDelete:false}]
  },
  change(e){
    var index = e.currentTarget.dataset.id;
    var deletedtodo='todos['+index+'].idDelete';
    this.setData({
       [deletedtodo]:true
    })
  }
})

转自:https://blog.csdn.net/chenzlyan/article/details/81565169

如果觉得我的文章对您有用,请随意赞赏。您的支持将鼓励我继续创作!

发表评论

电子邮件地址不会被公开。 必填项已用*标注