Vue入门到放弃12(自定义指令)

最新推荐文章于 2022-12-05 09:04:43 发布

开猿节流

最新推荐文章于 2022-12-05 09:04:43 发布

阅读量182

点赞数

分类专栏： vue Vue入门到放弃

本文为博主原创文章，未经博主允许不得转载。交流联系QQ：634487911

本文链接：https://blog.csdn.net/qq_38191191/article/details/103424568

版权

本文介绍了Vue中的自定义指令，包括语法、如何定义全局指令如`v-focus`，以及在不同阶段执行的方法如`bind`和`inserted`。通过案例展示了如何实现获取焦点和设置颜色属性的功能，并探讨了何时使用`bind`和`inserted`。同时，还讨论了如何创建自定义私有指令。

摘要由CSDN通过智能技术生成

Vue自定义指令

语法：

 Vue.directive('focus', {
      bind: function (el) {},
      inserted: function (el) {},
      updated: function (el) { }
    })

注意： Vue中所有的指令，在调用的时候，都以 v- 开头

使用 Vue.directive() 定义全局的指令 v-focus

// 其中：参数1 ：指令的名称，注意，在定义的时候，指令的名称前面，不需要加 v- 前缀,

// 但是：在调用的时候，必须在指令名称前加上 v- 前缀来进行调用

// 参数2：是一个对象，这个对象身上，有一些指令相关的函数，这些函数可以在特定的阶段，执行相关的操作

1.效果