vue中表单绑定修饰符

lazy
在默认情况下，v-model 在每次 input 事件触发后将输入框的值与数据进行同步 (除了上述输入法组合文字时)。你可以添加 lazy 修饰符，从而转为在 change 事件_之后_进行同步

<div id="app">   
        <input type="text" v-model="value">{{value}}
    </div>
    <script>
    var vm=new Vue({
        el:"#app",
        data:{
            value:''
        }
    })
    </script>

例如这样一段代码，当文本框发生变化时，value值事实输出，但我们想要整个文本框输完，文本框失去焦点的时候再输出value值，那就用到lazy

<div id="app">   
        <input type="text" v-model.lazy="value">{{value}}
    </div>
    <script>
    var vm=new Vue({
        el:"#app",
        data:{
            value:''
        }
    })
    </script>

number
如果想自动将用户的输入值转为数值类型，可以给 v-model 添加 number 修饰符

<div id="app">   
        <input type="text" v-model="value">{{value}}
    </div>
    <script>
    var vm=new Vue({
        el:"#app",
        data:{
            value:''
        },
        watch:{
            value(){
                console.log(typeof this.value)
            }
        }
    })
    </script>

无论文本框中输入的是字符串，还是数字，打印出来的类型都是string 当用了number修饰符后，如果输入数字，会转换成数值型然后再赋给value

<div id="app">   
        <input type="text" v-model.number="value">{{value}}
    </div>
    <script>
    var vm=new Vue({
        el:"#app",
        data:{
            value:''
        },
        watch:{
            value(){
                console.log(typeof this.value)
            }
        }
    })
    </script>

当输入字符型，控制台打印string 当输入数字型，控制台打印number

trim 清除首尾空格