【Vue】基础系列（八）自定义指令-生命周期

一、自定义指令

1. 定义语法：（1）局部指令：

   new Vue({                                                     new Vue({
           directives:{指令名：配置对象}       或                         directives{指令名：回调函数}
   })                                                            }）
   

   （2）全局指令：Vue.directive(指令名,配置对象) 或 Vue.directive(指令名,回调函数)
2. 配置对象中常用的3个回调：
   (1)bind：指令与元素成功绑定时调用。
   (2)inserted：指令所在元素被插入页面时调用。
   (3)update：指令所在模板结构被重新解析时调用。

   fbind:{
   	//指令与元素成功绑定时（一上来）
   	bind(element,binding){
   		element.value = binding.value
   	},
   	//指令所在元素被插入页面时
   	inserted(element,binding){
   		element.focus()
   	},
   	//指令所在的模板被重新解析时
   	update(element,binding){
   		element.value = binding.value
   	}
   }

3. (1)指令定义时不加v-，但使用时要加v-。
   (2)指令名如果是多个单词，要使用kebab-case命名方式，不要用camelCase命名。

二、生命周期

1. 生命周期又名生命周期回调函数、生命周期函数、生命周期钩子。是Vue在关键时刻帮我们调用的一些特殊名称的函数。生命周期函数的名字不可更改，但函数的具体内容是程序员根据需求编写的。生命周期函数中的this指向是vm 或 组件实例对象。
2. 常用的生命周期钩子：（1）mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】。（2）beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】。
3. 关于销毁Vue实例：（1）销毁后借助Vue开发者工具看不到任何信息。（2）销毁后自定义事件会失效，但原生DOM事件依然有效。（3）一般不会在beforeDestroy操作数据，因为即便操作数据，也不会再触发更新流程了。