【vue】父子组件数据双向绑定 v-model 和 sync

在线演示代码

• v-model 语法糖

---

v-model 是官方封装的指令，实现了父子组件的双向数据绑定，其实是官方提供的语法糖果

 
// 等价于

// 即

// 绑定iptVal参数给子组件，通过监听input事件，把value赋值给iptVal

$event 在内敛语句处理器中访问原始的DOM事件，可以获取特殊变量$event

• 在自定义组件中使用v-model

---

两种处理方法

1. 老版本

2. v2.2.0+ 新增 model通过model属性实现

第一种实现方式弊端：只能通过定义value和触发input
第二种实现方式：可以接受任意变量，触发任意自定义事件

• sync修饰符（v2.3.0+ 新增）

sync实现的好处，可是定义多个值，进行父子组件的数据绑定。