javascript - Vue.js事件在数据更新后触发

我有一个Vue.js应用程序，其中有两个用于处理一些重复性任务的组件。

我还从AJAX请求中获取数据。

我想要输入的内容是，如果有一个事件在Vue数据(treeData和flatTreeData)已更新并采取措施后触发，那么我可以执行其他任何措施吗？

var app = new Vue({
    el: 'body',
    data: {
        treeData: {items: {}},
        flatTreeData: [],
    },
});

$.getJSON('./paths.json').done(function(data) {

    // apply the file structure to the vue app
    demo.treeData = data;

    demo.flatTreeData = flattenTree(data);

});

最佳答案

您可以使用Vue实例的watch属性将监听器添加到变量更改中:http://vuejs.org/api/#watch

watch: {
    'treeData': function (val, oldVal) {
      console.log('new: %s, old: %s', val, oldVal)
    }
}

如果要对像watch这样的对象进行treeData编码，则可能需要使用deep标志来观察整个对象树。

watch: {
    'treeData':  {
        handler:function (val, oldVal){
            console.log('new: %s, old: %s', val, oldVal)
        },
        deep: true
    }
}