Vue.directive('zsqfocus', { // 注冊(cè)一個(gè)全局自定義指令 `v-zsqfocus`，在main.js文件里
 inserted: function (el) { // 當(dāng)被綁定的元素插入到 DOM 中時(shí)自動(dòng)調(diào)用
 el.focus() // 聚焦元素
 }
})

<script>
export default {
 directives: { // 指令的定義
 zsqfocus: {
 inserted: function (el) { // 獲得焦點(diǎn)
 el.focus()
 }
 }
 }
 }
</script>

<template>
 <input v-zsqfocus /> //調(diào)用 
</template>

<template>
 <div>
 <input v-model="dir1" v-my-directive1="dir1"/>　　　　 <input v-model="dir2" v-my-directive2="dir2"/>
 </div>
</template>
<script>
 export default {
 data(){
 return {　　　　　　　　　dir1:'',　　　　　　　　　dir2:''
　　　　　　　}
 },
 directives:{　　　　　　　//直接綁定函數(shù)，作用等同于update,不做準(zhǔn)備工作和掃尾工作
 myDirective1(val){
 console.log(val)
 },　　　　　　　myDirective2:{　　　　　　　　　　bind(){　　　　　　　　　　　　　//第一次綁定到元素的準(zhǔn)備工作　　　　　　　　　　},　　　　　　　　　　update(val，old){　　　　　　　　　　　　//在綁定到元素后立即以初始值第一次調(diào)用，然后每次example2變化都會(huì)調(diào)用update　　　　　　　　　　　　console.log(val)　　　　　　　　　　},　　　　　　　　　　　　unbind(){　　　　　　　　　　　　//銷毀前的清理工作　　　　　　　　　　}　　　　　　　}
 }
 }
</script>