vue学习---响应

1、增加属性
assign:
this.$set:vue.$set:
vm.$set:
2、mutationObserver:
当我们想想监听某个DOM发生了更改，可以使用MutationObserver，该API被所有现代浏览器支持。

方法:

disconnect()
　　阻止 MutationObserver 实例继续接收的通知，直到再次调用其observe()方法，该观察者对象包含的回调函数都不会再被调用。

observe()
　　配置MutationObserver在DOM更改匹配给定选项时，通过其回调函数开始接收通知。

takeRecords()
　　从MutationObserver的通知队列中删除所有待处理的通知，并将它们返回到MutationRecord对象的新Array中。

使用 MutationObserver:
通过往构造函数 MutationObserver 中传入一个函数作为参数来初始化一个 MutationObserver 实例，该函数会在每次发生 DOM 发生变化的时候调用。MutationObserver 的函数的第一个参数即为单个批处理中的 DOM 变化集。每个变化包含了变化的类型和所发生的更改。

var mutationObserver = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log(mutation);
  });
});

实例：

// Firefox和Chrome早期版本中带有前缀
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver
// 选择目标节点
var target = document.querySelector('#some-id'); 
// 创建观察者对象
var observer = new MutationObserver(function(mutations) {  
  mutations.forEach(function(mutation) { 
    console.log(mutation.type); 
  }); 
}); 
// 配置观察选项:
var config = { attributes: true, childList: true, characterData: true } 
// 传入目标节点和观察选项
observer.observe(target, config); 
// 随后,你还可以停止观察
observer.disconnect();

3、Vue异步更新队列
Vue的数据更新不是即时的，而是存在一个异步更新的队列，这个队列缓存所有在当前方法域内的数据变化，当相同watcher被监测到触发多次时，只会将最后一次变化存入队列中。
Vue提供等待数据变化的方法Vue.nextTick(callback)，当数据发生变化后，回调方法将被执行

参考：https://cn.vuejs.org/v2/guide/reactivity.html#search-query-nav