vue面试题：你用过自定义指令吗？

回答思路：

1. 定义
2. 何时用
3. 如何用
4. 常用指令
5. vue3变化

回答范例：

1.  vue有一些内置指令，如：v-model、v-show等，同时也支持用户注册自定义指令来扩展vue的能力。
2. 自定义指令主要完成一些可复用低层级DOM操作。
3. 使用自定义指令主要分为定义、注册、使用三步：

• 自定义指令有两种方式：对象和函数形式，前者类似组件定义，有各种生命周期，后者只会在mounted和updated时执行；（个人只对对象形式印象深点）
•  注册自定义指令类似组件，可以使用app.directive()全局注册，或者使用{directives:{xxx}}局部注册。
• 在使用时在注册名称前加上v-即可，比如v-focus;

4、 在项目中常用到的一些自定义指令，例如：v-premission按钮权限。

使用：

小tips(自定义指令的钩子函数):

Vue2：bind-指令绑定到元素后调用，只调用一次。

Inserted-元素插入父DOM后调用。

Update-当元素更新，子元素尚未更新时调用。

componentUpdate-被绑定的元素所在模板完成一次更新周期，就调用。

Unbind-一旦指令被移除就调用，只调用一次。

Vue3: created ：绑定元素属性或事件监听器被应用之前调用。该指令需要附加需要在普通的 v-on 事件监听器前调用的事件监听器时，这很有用。

beforeMounted ：当指令第一次绑定到元素并且在挂载父组件之前执行。

mounted ：绑定元素的父组件被挂载之后调用。

beforeUpdate ：在更新包含组件的 VNode 之前调用。

updated ：在包含组件的 VNode 及其子组件的 VNode 更新后调用。

beforeUnmounted ：在卸载绑定元素的父组件之前调用。

unmounted ：当指令与元素解除绑定且父组件已卸载时，只调用一次。

对象写法的自定义指令：

函数写法的自定义指令：