// 註冊一個全域性自定義指令 `v-focus`
Vue.directive('focus', {
  // 當被繫結的元素插入到 DOM 中時……
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
})

如果想註冊區域性指令，元件中也接受一個directives的選項：

directives: {
  focus: {
    // 指令的定義
    inserted: function (el) {
      el.focus()
    }
  }
}

然後你可以在模板中任何元素上使用新的v-focus

property，如下：

<input v-focus>

//例子

<template> <div> <divv-hello="red">注：這是紅色</div> <divv-hello="green">注：這是綠色</div> </div> </template> <script> //importVuefrom'vue' //Vue.directive("hello",function(el,binding,vnode){ //el.style["color"]=binding.value; //}) exportdefault{ name:'Element', data(){ return{ red:"red", green:'green' } }, directives:{ hello:function(el,binding,vnode){ console.log(el,binding,vnode) el.style["color"]=binding.value; } } } </script>