#### 1. 自定義一個全局指令 1. 使用 Vue.directive('指令名', {對象}) 定義全局的指令 v-focus 2. 其中：參數1：指令的名稱，注意，在定義的時候，指令的名稱前面，不需要加v-前綴 3. 但是：在調用的時候，必須在指令前加上v-前綴進行調用 4. 參數2：是一個對象，在這個對象身上，有一些指令相關的函數，這些函數可以在特定的階段，執行相關的操作 #### 2. 自定義一個v-focus焦點屬性 ``` Vue.directive('focus', { /* 每當指令綁定到元素上的時候，會立即執行這個bind函數，只執行一次 */ // 注意：在每個函數中，第一個參數，永遠是el,表示被綁定了指令的那個元素，這個el參數，是一個原生的JS對象 // 在元素 剛綁定的時候，還沒有插入到DOM中去，這時候調用focus方法，沒有作用 bind: function(el){ // el.focus() }, /* inserted 表示元素插入到DOM中的時候，會執行inserted函數【觸發一次】 */ // 和JS行為有關的操作，最好在inserted中去執行，防止JS行為不生效 inserted: function(el){ el.focus() }, /* 當VNode更新的時候，會執行updated，可能會觸發多次 */ updated: function(){ } }); ``` #### 3. 原生JS自動獲取焦點 ``` document.getElementById("input").focus(); ```