一、Directives 指令
两种写法:
1、声明一个全局指令
Vue.directive('x', directiveOptions)
就可以在任何组件里使用v-x了
例如:声明一个全局指令
在App.vue里点击图片,在HelloWorld.vue点击标题。都会打印x
2、声明一个局部指令
new Vue({
...,
directives: {
"x": directiveOptions
}
})
v-x只能用在该实例中
例如:这个组件就只能在HelloWorld.vue里使用
directiveOptions
五个函数属性
- bind(el绑定的元素,info详细的信息, vnode虚拟节点, oldVnode之前的虚拟节点)-类似created;只调用一次,指令第一次绑定到元素时调用。
- inserted(参数同上)-类似mounted;被绑定元素插入父节点时调用 (仅保证父节点存在,但不一定已被插入文档中)。
- update(参数同上)-类似updated;
- componentUpdated(参数同上)-用得不多,参见文档
- unbind(参数同上)-类似destroyed
自制指令,不用v-on
使用v-on
不使用v-on
我们如何得知用户使用的是click呢,使用info
打出info发现