1. 程式人生 > 其它 >vue全域性自定義指令 - 彈窗拖拽

vue全域性自定義指令 - 彈窗拖拽

1. 自定義一個全域性指令

  1. 使用 Vue.directive('指令名', {物件}) 定義全域性的指令 v-focus
  2. 其中:引數1:指令的名稱,注意,在定義的時候,指令的名稱前面,不需要加v-字首
  3. 但是:在呼叫的時候,必須在指令前加上v-字首進行呼叫
  4. 引數2:是一個物件,在這個物件身上,有一些指令相關的函式,這些函式可以在特定的階段,執行相關的操作

2. 建立一個js檔案

 3.在main.js中引入

 

 4.在需要的位置新增指令即可

 

 

指令定義函式提供了幾個鉤子函式(可選):

  • bind: 只調用一次,指令第一次繫結到元素時呼叫,可以定義一個在繫結時執行一次的初始化動作。
  • inserted: 被繫結元素插入父節點時呼叫(父節點存在即可呼叫,不必存在於 document 中)。
  • update: 被繫結元素所在的模板更新時呼叫,而不論繫結值是否變化。通過比較更新前後的繫結值。
  • componentUpdated: 被繫結元素所在模板完成一次更新週期時呼叫。
  • unbind: 只調用一次, 指令與元素解綁時呼叫。