vue Antd 輸入框Input自動聚焦方式
更新時間：2023年04月21日 09:37:22 作者：什么小蛋撻**
這篇文章主要介紹了vue Antd 輸入框Input自動聚焦方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
vue Antd 輸入框Input自動聚焦
1、從vue的實例屬性$ref去調input的focus方法使其實現(xiàn)聚焦。
<a-input type="text ref="ainput" />? <button @click="handleChange"></button>
2、點擊button自動聚焦，或其他事件需要聚焦
methods:{
? ? handleChange(){
? ? ? ? this.$nextTick(()=>{
? ? ? ? ? ? this.$refs.ainput.focus()
? ? ? ? })
? ? }
}vue中輸入框聚焦，自動跳轉下一個輸入框
需求
點擊請掃描庫位，enter鍵觸發(fā)后，跳轉到下一輸入框，然后自動聚焦另外一個輸入框上
<el-input
v-model="posName" clearable size="small" placeholder="請掃描庫位" style="width: 200px"
class="filter-item" @keyup.enter.native="jumpInput"
/>
<el-input
ref="barcodeMsg" v-model="barcode" clearable size="small" placeholder="請掃描物料信息"
style="width: 400px" class="filter-item" @keyup.enter.native="getSearch('material')"
/>
// enter鍵觸發(fā)
jumpInput() {
this.$refs.barcodeMsg.focus(); // 自動獲取焦點
},
如圖
總結
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
在Vue的模板語法中,我們學了很多指令,當然除了這些指令,Vue也允許我們自己定義自己的指令,所以本文就來和大家聊聊如何使用自定義指令吧2023-10-10
vue3+高德地圖只展示指定市、區(qū)行政區(qū)域的地圖以及遮罩反向鏤空其他地區(qū)
vue大屏項目開發(fā),客戶覺得地圖上的文字標注太多了,要求地圖上只顯示省市等主要城市的標注,這篇文章主要給大家介紹了關于vue3+高德地圖只展示指定市、區(qū)行政區(qū)域的地圖以及遮罩反向鏤空其他地區(qū)的相關資料,需要的朋友可以參考下2024-02-02
Vue3實現(xiàn)動態(tài)導入Excel表格數(shù)據的方法詳解
在開發(fā)工作過程中，我們會遇到各種各樣的表格數(shù)據導入，動態(tài)數(shù)據導入可以減少人為操作，減少出錯。本文為大家介紹了Vue3實現(xiàn)動態(tài)導入Excel表格數(shù)據的方法，需要的可以參考一下2022-11-11
今天小編就為大家分享一篇axios 封裝上傳文件的請求方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
vue3.0 CLI - 2.2 - 組件 home.vue 的初步改造
這篇文章主要介紹了vue3.0 CLI - 2.2 - 組件 home.vue 的初步改造,home.vue 組件有了兩個屬性：navs 和 tts 屬性，具體實例代碼大家跟隨小編一起通過本文學習吧2018-09-09
本文通過實例代碼給大家介紹了Vue axios配置,非常不錯，代碼簡單易懂，具有一定的參考借鑒價值，需要的朋友可以參考下2018-07-07
本文主要介紹了為什么vue中不建議使用空字符串作為className，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
分享12個Vue開發(fā)中的性能優(yōu)化小技巧(實用!)
一般來說,你不需要太關心vue的運行時性能,它在運行時非?？?但付出的代價是初始化時相對較慢,下面這篇文章主要給大家分享介紹了十二個Vue開發(fā)中的性能優(yōu)化小技巧,需要的朋友可以參考下2022-02-02
Vuex 是一個專為 Vue.js 應用程序開發(fā)的狀態(tài)管理模式,下面這篇文章主要給大家介紹了關于vuex新手進階篇之取值的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-10-10
vue+elementUI顯示表格指定列合計數(shù)據方式
這篇文章主要介紹了vue+elementUI顯示表格指定列合計數(shù)據方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10