HTML：

<p><b v-show="show">{{tag}}</b><input v-focus v-model="tag" :hidden="show" type="text"></p>

js：

官方例子：

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

我的：

directives: {  focus:function (el) {   el.focus();  } }

在我的項(xiàng)目中使用官方的例子時(shí)，input不能自動(dòng)獲取焦點(diǎn)，使用我的js時(shí)可自動(dòng)獲取焦點(diǎn)，查詢相關(guān)資料后知道，insert是一個(gè)鉤子函數(shù)，只要父節(jié)點(diǎn)存在，在插入父節(jié)點(diǎn)時(shí)調(diào)用，我這里并沒有插入所以沒有調(diào)用，所以還是要多讀多學(xué)，仔細(xì)一些。

拓展知識(shí)：vue 自定義指令 自動(dòng)聚焦的實(shí)例講解

如下所示：

<el-input v-model="data.carDealerJobs.bankDetail" v-focus placeholder="請(qǐng)輸入內(nèi)容" size="small"></el-input>

局部注冊(cè)指令：

 directives: {  focus: {  inserted: function (el) {   el.children[0].focus()  }  } }

以上這篇vue 自定義指令自動(dòng)獲取文本框焦點(diǎn)的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持錯(cuò)新站長站。