vue使用element-ui的el-input監(jiān)聽不了回車事件的解決方法
更新時(shí)間：2018年01月12日 15:38:51 作者：無(wú)所事事者愛嘲笑
小編在使用element-ui時(shí)，el-input組件監(jiān)聽不了回車事件，怎么回事呢？下面小編給大家?guī)?lái)了vue使用element-ui的el-input監(jiān)聽不了回車事件的解決方法，一起看看吧
原因
今天在使用element-ui時(shí)，el-input組件監(jiān)聽不了回車事件，如下代碼沒有想要的效果：
<el-input class="search-input" placeholder="請(qǐng)輸入內(nèi)容" v-model="searchText" @keyup.enter="search()"></el-input>
原因應(yīng)該是element-ui自身封裝了一層input標(biāo)簽之后影響了事件的監(jiān)聽，在element-ui里有很多因?yàn)樽陨矸庋b了幾層標(biāo)簽導(dǎo)致事件和樣式無(wú)法按想要的效果呈現(xiàn)，遇到后可以在網(wǎng)頁(yè)中查看dom結(jié)構(gòu)分析原因。
解決
在事件后面加上.native：
<el-input class="search-input" placeholder="請(qǐng)輸入內(nèi)容" v-model="searchText" @keyup.enter.native="search()"></el-input>
總結(jié)
以上所述是小編給大家介紹的vue使用element-ui的el-input監(jiān)聽不了回車事件的解決方法，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
vue結(jié)合echarts繪制一個(gè)支持切換的折線圖實(shí)例
這篇文章主要介紹了vue結(jié)合echarts繪制一個(gè)支持切換的折線圖實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
vue實(shí)現(xiàn)登陸頁(yè)面開發(fā)實(shí)踐
本文主要介紹了vue實(shí)現(xiàn)登陸頁(yè)面開發(fā)實(shí)踐，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-05-05
上傳圖片不管是后臺(tái)還是前端小程序，上傳圖片都是一個(gè)比不可少的功能有時(shí)候需要好幾個(gè)頁(yè)面都要上傳圖片，每個(gè)頁(yè)面都寫一個(gè)非常不方便，本文就給大家介紹vue如何封裝一個(gè)上傳多張圖片的組件,需要的朋友可以參考下2023-07-07
Vue數(shù)據(jù)驅(qū)動(dòng)模擬實(shí)現(xiàn)2
這篇文章主要介紹了Vue數(shù)據(jù)驅(qū)動(dòng)模擬實(shí)現(xiàn)的相關(guān)資料，實(shí)現(xiàn)Observer構(gòu)造函數(shù)，監(jiān)聽已有數(shù)據(jù)data中的所有屬性，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01
今天小編就為大家分享一篇vue之debounce屬性被移除及處理詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2019-11-11
vue使用docx-preview實(shí)現(xiàn)docx文件在線預(yù)覽功能全過程
文件在線預(yù)覽是目前移動(dòng)化辦公的一種新趨勢(shì),下面這篇文章主要給大家介紹了關(guān)于vue?docx-preview實(shí)現(xiàn)docx文件在線預(yù)覽功能的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
vue+vuex+axios從后臺(tái)獲取數(shù)據(jù)存入vuex,組件之間共享數(shù)據(jù)操作
這篇文章主要介紹了vue+vuex+axios從后臺(tái)獲取數(shù)據(jù)存入vuex,組件之間共享數(shù)據(jù)操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2020-07-07
這篇文章主要介紹了vue-router路由懶加載和權(quán)限控制的相關(guān)資料2017-12-12
打包壓縮成zip的東西,再解壓,很麻煩,本文主要介紹了vue中預(yù)覽zip的實(shí)現(xiàn)示例,具有一定的參考價(jià)值,感興趣的可以了解一下2023-09-09
今天小編就為大家分享一篇vue 實(shí)現(xiàn)特定條件下綁定事件，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2019-11-11