1、lazy

<input type="text" v-model="name">

相當於

<input type="text" :value="name" @input="(e)=>name=e.target.value">

加上lazy修飾符

<input type="text" v-model.lazy="name">

相當於（將input事件改為change事件）

<input type="text" :value="name" @change="(e)=>name=e.target.value">

change事件在輸入時不會改變data中的資料：

它是在失焦時才觸發更新

注意：el-input和van-field的v-model載入lazy修飾符沒有作用

2、number（elementUI和vant只能輸入純數字，並且是數值型）

    <input type="number" v-model.number="age" />
    <p>{{age}} {{typeof age}}</p>

加上number修飾符後，如果輸入的是數字那麼值型別就一直是數字，如果輸入的第一個字元是字串那麼值型別就為字元型了

和type='number'搭配使用，禁止數字外的字元輸入就可以一直是數字型

不過設定了type='number'後，輸入框會有兩個小箭頭

這看著多難受，也可以使用oninput="value=value.replace(/[^\d]/g,'')" 【推薦】

<input v-model.number="age" oninput="value=value.replace(/[^\d]/g,'')" />

這樣可以保證input中輸入的是數字型數字！

elementUI的el-input加上type='number'也會有這個醜陋的箭頭：

所以推薦：

el-input v-model.number="num" oninput="value=value.replace(/[^\d]/g,'')" />

vant的van-field加上type='digit'或type='number'沒有醜陋的箭頭

以下這兩種方式效果一樣：

<van-field type="digit" v-model.number="num" label="數字" />

<van-field oninput="value=value.replace(/[^\d]/g,'')" v-model.number="num" label="數字" />

而type='number'支援小數

<van-field type="number" v-model.number="num" label="數字" />

3、trim

去除首尾兩端的空格，同樣適用於elementUI和vant

    <input v-model.trim="name" />
    <p>開頭{{name}}結尾</p>

    <el-input v-model.trim="name" />

    <van-field v-model.trim="name" />