this.setData, this.data, this.$data的关系
发布于 7 年前 作者 phan 10981 次浏览 来自 问答

请问下，谁能讲解下这三者关系，用久了Vue，来看这东西，不伦不类的, 而且我遇到了很多bug。

this.setData() -> 我的理解是抄袭react的setState()

  1. 官方的解释 setData 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）

    可你有个代码示例是：

    1. changeNum: function() {    this.data.num = 1
    this.setData({
      num: this.data.num
    })
  },

      既然都说会同步改变对应的this.data的值，上面的this.data.num = 1这句话，岂不是多次一举

    2. 实际测试时，发现不调用this.data.num的话，你在语句执行后，执行console.log(this.data.num)，你又会神奇的发现，值还是this.setData之前的值，所以好坑啊，还必须加上。此时this.$data.num倒是变成了最新的值。

 

  1. 问题是我用wepy时，@tap=“callFun”，分别绑定了如下两种setData的方法，结果完全不一样
data = {
    first: -2,
    sth: {
        sec: -2
    }
}
// 这个方法虽然调用时，成功了，设完后，又很快变回初始值

callFun () {   

 this.setData({

    first: this.data.first = 1  // 设置后值会瞬间被变回原始值-2

 })

}

// 这个方法的实现倒是可以，好神奇

callFun () {

  this.setData({
    'sth.sec': this.sth.sec = 1 // ok 一直是1

 })

}



                我已经疯了，哪个大神能帮忙解释下，微信的小程序好坑爹的感觉    ，另外这个提交问题的编辑器老是光标消失，然后    不能打字，要按tab很多下，或者回车然后又出现光标

3 回复

兄弟，wepy的问题去wepy的官方库的issue里面找答案

wepy里面给变量赋值直接this.xxxx，更新视图this.$apply()，不知道你用的哪个版本的wepy

好好看下wepy的文档

看一下wepy数据的绑定方式和wepy的脏数据检查流程，你应该就能明白了

其实不是很建议用wepy，虽然开发上方便了，毕竟还会再编译一遍，会踩一些不必要的坑，工具上和真机上的表现可能会有差异，你可能检查半天都检查不出来个所以然的，还是用原生好一些，社区也完善一点

一上手，直接用wepy干小程序，刚测试发现原生里this下面不存在 $data这个属性。原来只有wepy才有。直接弄wepy方便是方便，bug也多，还会导致认知上的缺陷。

你好 根据你给的代码，first并没有瞬间便会原始值呀。

回到顶部