vue使用element-ui的el-input監聽不了回車事件的解決方法
來源:懂視網
責編:小采
時間:2020-11-27 22:21:47
vue使用element-ui的el-input監聽不了回車事件的解決方法
vue使用element-ui的el-input監聽不了回車事件的解決方法:原因 今天在使用element-ui時,el-input組件監聽不了回車事件,如下代碼沒有想要的效果: <el-input class=search-input placeholder=請輸入內容 v-model=searchText @keyup.enter=search()></e
導讀vue使用element-ui的el-input監聽不了回車事件的解決方法:原因 今天在使用element-ui時,el-input組件監聽不了回車事件,如下代碼沒有想要的效果: <el-input class=search-input placeholder=請輸入內容 v-model=searchText @keyup.enter=search()></e

原因
今天在使用element-ui時,el-input組件監聽不了回車事件,如下代碼沒有想要的效果:
<el-input class="search-input" placeholder="請輸入內容" v-model="searchText" @keyup.enter="search()"></el-input>
原因應該是element-ui自身封裝了一層input標簽之后影響了事件的監聽,在element-ui里有很多因為自身封裝了幾層標簽導致事件和樣式無法按想要的效果呈現,遇到后可以在網頁中查看dom結構分析原因。
解決
在事件后面加上.native:
<el-input class="search-input" placeholder="請輸入內容" v-model="searchText" @keyup.enter.native="search()"></el-input>
總結
以上所述是小編給大家介紹的vue使用element-ui的el-input監聽不了回車事件的解決方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
vue使用element-ui的el-input監聽不了回車事件的解決方法
vue使用element-ui的el-input監聽不了回車事件的解決方法:原因 今天在使用element-ui時,el-input組件監聽不了回車事件,如下代碼沒有想要的效果: <el-input class=search-input placeholder=請輸入內容 v-model=searchText @keyup.enter=search()></e