Vue.delete & Vue.set 无法触发watch

[gebilaoxiong]

您好，上次拜读您代码的时候还是0.11版本，非常喜欢。最近Vue升级到了1.0X版本，于是又读了一遍

在断点的时候遇到个问题：

按照您的设计：对象和数组中____ob____的dep是用来监控数组结构的，在数组中任何改变数组结构的方法('push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse')都会调用数组的____ob____.dep.notify。按照这个逻辑在对象结构发生变化的时候是不是也会调用对象的____ob____.dep.notify; 不知道是不是我的理解有误，下面的代码没有触发watcher的update。

以下是测试代码：

    var testVM = new Vue({
      el:'#ct',
      data: {
        name: '测试人员',
        info: {
          age: 12,
          school: '测试学校'
        },
        frends: [{}]
      }
    });

    testVM.$watch('info', function() {
      console.log('info 的 wather');
    });

    Vue.delete(testVM.info, 'age');  //info 的wath处理函数并没有触发

[luckymore]

@gebilaoxiong 大哥，你试试用testVM.$delete('age');

[luckymore]

@gebilaoxiong work well

var testVM = new Vue({
      el:'#ct',
      data: {
        name: '测试人员',
        info: {
          age: 12,
          school: '测试学校'
        },
        frends: [{}]
      }
    });

    testVM.$watch('info', function(n, o) {
      alert(n + " " + o);
      testVM.$delete('info.age');
    });

<div id="ct">
  <input type="text" v-model="info.age">{{info.age}}
</div>

[gebilaoxiong]

@luckymore 按照他的设计，删除info.age的时候，监控info的watch应该被触发

[luckymore]

你的使用方式不对吧，确实触发了。

[gebilaoxiong]

@luckymore 我的意思是在代码中操作删除age
你的代码意思是修改age，然后在监控中删除他。

但是，貌似你的删除操作也没有生效。

明白吗

[hbrls]

我好像也遇到过，后来换 vuex 就没继续跟进了

[yyx990803]

这里确实有些不一致，现版本修改对象的结构需要 deep watcher 才会触发:

testVM.$watch('info', function() {
  console.log('info 的 wather');
}, { deep: true });

下个版本不需要 deep 也会触发。