1.Vue.set

动态添加响应式数据

Vue.set(target, propertyName/index, value)

等价于 vm.$set / this.$set

Vue.set(c, 'price', 100);
Vue.set(array, 1, obj);

2.Vue.delete

动态删除响应式数据

• Vue.delete(target, propertyName/index, value)

• 如直接使用 delete obj[propertyName] 不会修改触发的响应式数据

• 等价于vm.$delete / this.$delete

    Vue.delete(c, 'price');
  

3.vm.$on

监听当前实例上的自定义事件。事件可以由 vm.$emit 触发。回调函数会接收所有传入事件触发函数的 额外参数。

典型应用：事件总线 通过在Vue原型上添加一个Vue实例作为事件总线，实现组件间相互通信，而且不受组件间关系的影响 Vue.prototype.$bus = new Vue();

所有子页面都监听自己关闭的事件，由父页面统一派发。

//平时在父页面使用子组件
<message  @myFunc="myCallback"  >
等价于
message实例.$on("myFunc",myCallback)
//myCallback是当前父类的方法

• $on 和 $emit都是同一个子组件message 派发和接受，
• 在message 组件method 调用this.$emit('myFunc')//派发事件
• 对应的myCallback被执行

使用场景： 1对多，一个父页面同时通知多个子页面关闭相关操作

4.vm.$once

监听一个自定义事件，但是只触发一次。一旦触发之后，监听器就会被移除。

5.vm.$off

• 移除自定义事件监听器。

• 如果没有提供参数，则移除所有的事件监听器；

• 如果只提供了事件，则移除该事件所有的监听器；

• 如果同时提供了事件与回调，则只移除这个回调的监听器。

    vm.$off() // 移除所有的事件监听器 
    vm.$off('test') // 移除该事件所有的监听器 
    vm.$off('test', callback) // 只移除这个回调的监听器
  

6.ref和this.$refs

ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通 的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件

<input type="text" ... ref="inp"> mounted(){ // mounted之后才能访问到inp 
this.$refs.inp.focus() }

• ref 是作为渲染结果被创建的，在初始渲染时不能访问它们
• $refs 不是响应式的，不要试图用它在模板中做数据绑定
• 当 v-for 用于元素或组件时，引用信息将是包含 DOM 节点或组件实例的数组。