如下所示：

.lazy

並不是實時改變，而是在失去焦點或者按回車時才會更新

.number

將輸入轉換成Number型別

.trim

可以自動過濾輸入首尾的空格

補充知識：vue通過v-model，@input,@v-model.lazy幾種輸入框資料更新方式的區別

在使用v-model時，如果用中文輸入法輸入中文，一般在沒有選定片語前，也就在拼音階段，Vue是不會更新資料的，當敲下漢字時才會觸發更新。如果希望總是實時更新，可以用@input來代替v-model.

<div id="app">
  <input type="text" v-model.lazy="message" placeholder="請輸入">
  <p>輸入的內容是:{{ message }}</p>
  <input type="text" @input="handleInput" placeholder="請輸入">
  <p>輸入的內容是:{{ message1 }}</p>
 </div>

 <script type="text/javascript">
  var app = new Vue({
   el: '#app',data: {
    message:'',message1:''
   },methods:{
    handleInput:function(e){
     this.message1 = e.target.value //原生的DOM事件
    }
   }
  })
 </script>

而v-model也有修飾符，.lazy會轉變為在change事件中同步，這時。message並不是實時改變，而是在失去焦點和按回車時才會更新

以上這篇Vue的v-model的幾種修飾符.lazy,.number和.trim的用法說明就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援我們。