Vue表单输入绑定v-model
表单输入绑定
在前端处理表单时，我们常常需要将表单输入框的内容同步给Javascript中相应的变量。手动连接绑定和更改事件监听器可能会很麻，v-model 指令帮我们简化了这一步骤。
<template><h3>表单输入绑定</h3><hr>
<input type="text" v-model="message" ><p>Message is: {{ message }}</p></template><script>export default {data(){return{message:"",}}}</script>运行结果：
复选框
单一的复选框，绑定布尔类型值。
<template><h3>表单输入绑定</h3><hr>
<input type="checkbox" id="checkbox" v-model="checked">
<label for="checkbox" >{{ checked }}</label></template><script>export default {data(){return{checked:true}}}</script>运行结果：
修饰符
v-model 也提供了修饰符：.lazy ,.number , .trim
.lazy
默认情况下，v-model 会在每次input事件后更新数据。可以添加lazy修饰符来改为在每次change事件后更新数据。
<template><h3>表单输入绑定</h3><hr>
<input type="text" v-model.lazy="message" ><p>Message is: {{ message }}</p></template><script>export default {data(){return{message:"",}}}</script>回车前
回车后：
