Vue中使input和el-input自動獲取焦點的處理

一、【普通<input>的自定義指令操作】：先在入口文件注冊一個全局自定義指令

// main.js
Vue.directive('focus', {
  inserted (el, binding, vnode) {
    // 聚焦元素
    el.focus()
  }
})

【普通<input>的自定義指令使用】：v-"+指令名"

// index.vue
<input v-focus placeholder="因為有v-focus,所以我聚焦了" />

二、【<el-input>的自定義指令操作】：先在入口文件注冊一個全局自定義指令

// main.js
Vue.directive('fo', {
  inserted (el, binding, vnode) {
    // 聚焦元素
    el.querySelector('input').focus()
  }
})

【<el-input>的自定義指令使用】：v-"+指令名"

// index.vue
<el-input v-fo placeholder="因為有v-fo,所以我聚焦了"></el-input>

分析：通過自定義指令來實現