微信小程序开发——setData的使用技巧

2021年1月17日08:47:32 发表评论 57 views

使用 setData ,一直都是作为给变量赋值,感觉比起vue给data中的变量的赋值还是有点麻烦的。

最近项目不太紧张,为了提高小程序的开发效率及提升小程序开发的能力,又重新的通读了下小程序的开发文档。发现 setData 还有一个非必填的参数 callback——setData引起的界面更新渲染完毕后的回调函数,通过这个回调函数,可以在更新data中的数据的时候,同步在回调函数中进行相应操作,这比更新数据和后续操作分开写好多了。

Page.prototype.setData(Object data, Function callback):

字段类型必填描述最低版本
dataObject这次要改变的数据
callbackFunctionsetData引起的界面更新渲染完毕后的回调函数1.5.0

其中 key 可以以数据路径的形式给出,支持改变数组中的某一项或对象的某个属性,如 array[2].messagea.b.c.d,并且不需要在 this.data 中预先定义。关于key以数据路径的形式使用及callback回调函数的使用如下:

data: {
    leader: {
      name: "Pony.ma",
      age: 42
    }
  },
  ...
  changeData() {
    var self=this
    self.setData({
        "leader.name": "jack.ma"
      },
      function() {
        wx.showToast({
          title: "团队leader已经更改为:"+self.data.leader.name,
          icon: "none"
        })
      })
  },

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: