微信小程序怎么监听data数据的变化？类似于vue的watch

[youngjuning]

推荐使用这个：donghaohao/vuefy ：微信小程序使用 watch 和 computed http://t.cn/Rmq1dpx

[youngjuning]

其他方案

1. wepy
2. mpvue

[youngjuning]

相关链接

1. 【watch】提供小程序响应data实例上的数据变动
2. 小程序怎么监听data数据的变化？类似于vue的watch

[youngjuning]

小程序不提供类似于vue一样监听数据(vm.watch)，当数据改变时触发回调检测改变数据类型是否符合要求。

现在，使用 wach 即可扩展类似 vm.watch 的功能

点击下载：watch

jayZOU/watch的使用

引入watch库

import Watch from '/utils/watch'

配置初始化检察对象

import Watch from '/utils/watch'
let watch
Page({
    data: {
        a: '1',
        b: {
            c: {
                d: 33
            },
            e: [1, 2, [3, 4]]
        }
    },
    watch: {
        a: function(val, oldVal) {
            console.log('new: %s, old: %s', val, oldVal)
        },
        'b.c.d': function(val, oldVal) {
            console.log('new: %s, old: %s', val, oldVal)
        },
        'b.e[2][0]': function(val, oldVal) {
            console.log('new: %s, old: %s', val, oldVal)
        },
        'b.e[3][4]': function(val, oldVal) {
            console.log('new: %s, old: %s', val, oldVal)
        },
    }
})

可以将需要监听的数据放入watch里面，当数据改变时推送相应的订阅事件(注：不在data里面的数据项不会放入观察者列表，比如上面的'b.e[3][4]')

实例化watch

watch = new Watch(this)

当watch创建示例初始化时会把监听数据项放入观察者列表里面

改变数据

watch.setData({
    a: 2,
    'b.c.d': 3,
    'b.e[2][0]': 444,
    c: 123
})

watch.data('b.e[2][0]', 555);

关于 API，请移步 watch 的库中阅读。