自定義指令----focus獲取焦點事件


 <input type="text" class="form-control" v-model="keywords" id="search" v-focus > 
  /*使用Vue.directiive()定義全局的指令
        其中:參數1:指令的名稱,之一在定義的時候,指令的名稱前 面不需要加 v- 前綴, 但是在調用的時候必須加v-
              參數2:是一個對象,在這個對象上,有一些指令相關函數,這些函數可以在特定階段,執行相關的操作
        */
        
        Vue.directive('focus', {
            //注意在每個函數中,第一個參數永遠是el表示被綁定了指令的哪個元素,這個el是元素的js對象  
            bind: function(el){//每當指令綁定到元素上的時候,會立即執行,只執行一次
                //在元素綁定了指令時候,還沒有插入到DOM中去,這時候調用focus方法沒有作用。因為這個元素只有在插入DOM之后才能獲取焦點。

            },
            inserted: function(el){// 元素插入到DOM中的時候,會執行inserted函數,觸發一次
                el.focus()
            },
            updated(el) {//當VNode更新的時候,會執行updated,可能會觸發多次
                
            },
        })

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM