Vue iview input 使用 @click、@keyup.enter 失效

本文轉載自查看原文 2020-07-03 13:57 834 HTML

在頁面上，使用element ui中的<el-button>、iview中的<Input>或者自己定義的組件，我們習慣稱為子組件，給子組件綁定事件@click，它會默認為子組件的自定義事件，子組件內部處理click事件然后向外發送click事件：$emit，外部的父組件給子組件綁定的事件才有效。那么，如何給子組件綁定原生事件（也就是不需要子組件內部處理）呢？

給子組件綁定原生事件，需要借助native。

native ：監聽組件根元素的原生事件，主要是給自定義的組件添加原生事件

使用方式如下：

<Input v-model="search_value" search @click.native="search_essay()" @keyup.enter.native="search_essay()" placeholder="輸入你要搜索的內容..." />

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 Vue element keyup.enter失效不起作用 Vue中輸入框組件使用-@input、@keyup.enter、@change、@blur vue中輸入框事件的使用——@input、@keyup.enter、@change、@blur BUG1： vue中使用@keyup.enter(@keyup.enter.native)事件，和click事件綁定同一個函數，但是結果卻不一樣 Vue之@click、事件修飾符@click.stop與@click.prevent、按鍵修飾符@keyup.enter Vue之@click、事件修飾符@click.stop與@click.prevent、按鍵修飾符@keyup.enter vue中@keyup.enter沒有作用當使用vue的按鍵修飾符不起效果的時候怎么辦?如@keyup.enter = '' ; vue 監聽鍵盤回車事件 @keyup.enter與@keyup.enter.native vue 監聽鍵盤回車事件 @keyup.enter || @keyup.enter.native