自定义指令有什么用?自定义指令的语法

267 阅读1分钟

当内置指令不能满足我们需求时,我们还可以通过“自定义指令”来扩展额外功能。

自定义指令分为“全局自定义指令”和“局部自定义指令”

全局指令:Vue.directive(‘指令名’,{inserted (el,binding) {} })

el:指令绑定的DOM元素,当前使用的元素,可直接操作**

binding:带参指令相关信息,可以拿到指令所赋的值

inserted:钩子函数,解析元素的时候触发

===============================================

1.先给组件需要的地方绑定自定义的“指令名” 如:

Snipaste_2022-05-26_22-52-18.png

2.将全局自定义指令写在main.js文件中,可直接使用 如:

Snipaste_2022-05-26_22-52-57.png

局部指令:directives:{指令名:{inserted(el,binding){} }}

局部指令可以直接写在当前的组件中,也可以写在单独文件在引入使用。

1.先给组件需要的地方绑定指令名

2.在写入局部自定义指令

Snipaste_2022-05-26_22-52-32.png