v-model 和 .sync修饰符的区别

一、v-model

vue框架中 v-model一般用于在表单元素中进行双向数据绑定。

v-model指令本质上是一个语法糖。

语法糖的大概意思就是 是一种更加方便的写法，在不影响其功能的情况下。增加可读性，减少出错率。更加方便使用。

一般我们通过下面的例子使用v-model指令实现双向数据绑定

<input type="text" v-model="val" />
//val 是data里定义好的变量

下面是实际上完整的写法：

<input :value="val" @input="val=$event.target.value" />

//val是data里定义好的变量 
//$event是事件对象 

input元素本身有个input事件，是HTML5新加的。每当输入框内容发生变化，就会触发input事件，把最新的value值（$event.target.value）传给val。这就是双向数据绑定。

注意：不是所有能进行双向绑定的元素 利用的都是input事件。

利用v-model在父子组件中进行数据绑定

//父组件