收藏
回答

this.setData, this.data, this.$data的关系

问题模块 框架类型 问题类型 终端类型 微信版本 基础库版本
框架 小程序 Bug 工具 1.02.18 2.0.8

请问下,谁能讲解下这三者关系,用久了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倒是变成了最新的值。

       

2. 问题是我用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很多下,或者回车然后又出现光标



最后一次编辑于  2018-06-14
回答关注问题邀请回答
收藏

3 个回答

  • roy
    roy
    2018-06-14

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

    2018-06-14
    赞同
    回复
  • Witcher_ciri
    Witcher_ciri
    2018-06-14

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

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

    好好看下wepy的文档

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

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

    2018-06-14
    赞同
    回复 1
    • roy
      roy
      2018-06-14

      谢谢,我用原生的代码测试, 确实没有问题,冤枉小程序了,看来wepy确实要背这个锅了

      2018-06-14
      回复
  • 一碗肉nina
    一碗肉nina
    2018-06-14

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

    2018-06-14
    赞同
    回复 2
    • roy
      roy
      2018-06-14

      真的吗,我这边项目中一直是这样的,我回头开个干净project测一下

      2018-06-14
      回复
    • roy
      roy
      2018-06-14

      原生没有问题。

      2018-06-14
      回复