Vue中輸入框組件使用-@input、@keyup.enter、@change、@blur

一、@input (或是v-on:input)

使用：

<input type="text" placeholder="通過乘車人/訂單號查詢" v-model="inputVal"  v-on:input="search" value="" />

　　適用於實時查詢，輸入每一個字符都會觸發該事件

二、@keyup.enter

該方法與v-on:input時間的區別在於：input事件是實時監控的，每次輸出都會調用，而@keyup.enter事件則是在pc上需要點擊回車鍵觸發，而在手機上則是需要點擊輸入鍵盤上的確定鍵彩殼觸發。

三、@change

該事件嗯enter事件相似，在手機上都是要經過觸發的虛擬鍵盤才會觸發事件。使用方式同input事件

四、@blur(失焦)

要滿足輸入框在輸入完成、移到其他地方進行驗證時，需要用到該事件，用此事件進行綁定驗證方法即可。

<mt-field label="用戶名" placeholder="請輸入用戶名" type="text" v-model="username" @blur.native.capture="testUser"></mt-field>

　　

內容參考：https://blog.csdn.net/zuoyiran520081/article/details/86611608