1在最近的一個專案中，需要對input的readonly進行操作，翻遍了vue文件不知道如何下手，最後把目標鎖定在指令上

        一，指令的寫法

                    directives: {
                  ronly: {
                   componentUpdated: function (el,binding) {
                     if(binding.arg=='編輯'){
     el.setAttribute('readonly','readonly')
                     }else{
     el.removeAttribute('readonly')
                        }
                   }
                 }

}

        二，鉤子函式   

• bind：只調用一次，指令第一次繫結到元素時呼叫。在這裡可以進行一次性的初始化設定。

• inserted：被繫結元素插入父節點時呼叫 (僅保證父節點存在，但不一定已被插入文件中)。

• update：所在元件的 VNode 更新時呼叫，但是可能發生在其子 VNode 更新之前。指令的值可能發生了改變，也可能沒有。但是你可以通過比較更新前後的值來忽略不必要的模板更新 (詳細的鉤子函式引數見下)。

• componentUpdated：指令所在元件的 VNode 及其子 VNode 全部更新後呼叫。

• unbind：只調用一次，指令與元素解綁時呼叫。

        三，鉤子函式引數

• el：指令所繫結的元素，可以用來直接操作 DOM 。
• binding：一個物件，包含以下屬性：
  • name：指令名，不包括 v- 字首。
  • value：指令的繫結值，例如：v-my-directive="1 + 1" 中，繫結值為 2。
  • oldValue：指令繫結的前一個值，僅在 update 和 componentUpdated 鉤子中可用。無論值是否改變都可用。
  • expression：字串形式的指令表示式。例如 v-my-directive="1 + 1" 中，表示式為 "1 + 1"。
  • arg：傳給指令的引數，可選。例如 v-my-directive:foo 中，引數為 "foo"。
  • modifiers：一個包含修飾符的物件。例如：v-my-directive.foo.bar
     中，修飾符物件為 { foo: true, bar: true }。
• vnode：Vue 編譯生成的虛擬節點。移步 VNode API 來了解更多詳情。
• oldVnode：上一個虛擬節點，僅在 update 和 componentUpdated 鉤子中可用。

效果：

        這個時候是禁用的

        這個時候就可用編輯文字框了