vue 自定义指令 ==

除了核心功能默认内置的指令 (v-modelv-show),Vue 也允许注册自定义指令。 v-xxx

html+css的复用的主要形式是组件

你需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令

局部注册和使用

//1. 创建自定义指令

// 全局 / 局部

// 2. 在标签上使用自定义指令  v- 指令名

 

注意:

//   bind 操作样式,不要写js

//  inserted 可以操作样式,也可以操作dom的行为的js

// inserted方法 - 指令所在标签, 被插入到网页上触发(一次)

// update方法 - 指令对应数据/标签更新时, 此方法执行

 

 

 

全局注册

在main.js用 Vue.directive()方法来进行注册, 以后随便哪个.vue文件里都可以直接用v-fofo指令

// 全局指令 - 到处"直接"使用

Vue.directive("gfocus", {

  inserted(el) {

    el.focus() // 触发标签的事件方法

  }

})

自定义指令-传值

 

 

 

 

 总结: v-xxx, 自定义指令, 获取原生DOM, 自定义操作

 

Guess you like

Origin blog.csdn.net/weixin_58726419/article/details/121001753