一、Vue3 与 Vue2 自定义指令文档Vue3 自定义指令文档https://cn.vuejs.org/guide/reusability/custom-directives.htmlVue2 自定义指令文档https://v2.cn.vuejs.org/v2/guide/custom-directive.html二、Vue3 与 Vue2 自定义指令实现1、全局自定义指令实现Vue3 全局自定义指令实现// 注册自定义指令 v-focus// 当元素挂载后自动聚焦app.directive(focus,{mounted(el){el.focus()}})inputv-focustypetextplaceholder这个输入框会自动聚焦/Vue2 全局自定义指令实现Vue.directive(focus,{inserted(el){el.focus()}})inputv-focustypetextplaceholder这个输入框会自动聚焦/2、局部自定义指令实现Vue3 局部自定义指令实现template input v-focus typetext placeholder这个输入框会自动聚焦 / /template script setup langts const vFocus { mounted(el) { el.focus(); }, }; /scriptVue2 局部自定义指令实现template input v-focus typetext placeholder这个输入框会自动聚焦 / /template script export default { name: LocalDirectiveDemo, directives: { focus: { inserted(el) { el.focus() } } } } /script三、Vue3 与 Vue2 自定义指令钩子函数Vue3 自定义指令钩子函数钩子函数说明created创建beforeMount挂载前mounted挂载后beforeUpdate更新前updated更新后beforeUnmount卸载前unmounted卸载后Vue2 自定义指令钩子函数钩子函数说明bind绑定inserted插入update更新componentUpdated组件更新unbind解绑