概念
首先需要明确的一个概念，数据响应式不等于双向绑定。
数据响应式：通过数据的改变去驱动视图的变化。
双向绑定：除了数据的改变去改变视图的变化外，视图的变化反过来也影响数据。
在Vue中，使用v-model这个语法糖来实现双向绑定。
应用场景
v-model的应用场景有两个：
表单元素：填写表单时，视图变化更新数据；
组件：父组件通过v-model给子组件传值，子组件的触发父组件的自定义方法，更新传给子组件的值。
⚠️ 这里子组件的触发父组件的自定义方法，父组件是不需要做额外操作的，开发者不需要在父组件去硬编码监听这个子组件的事件，更不需要为这个事件添加回调函数，因为这些都是v-model内部做的事情。
表单元素
可以将表单元素看作一个子组件，父组件将响应式数据的值传给表单元素。
根据表单元素的类型，编译过程中会给父组件添加自定义事件，当表单元素值变化的时候，会触发这个编译过程中生成的自定义事件。
这个自定义事件的参数值就是表单元素变化后的值，开发者不需要额外处理，它会自己完成对父组件传给子组件值的更新。
组件
父组件将响应式数据的值传给子组件。
要实现双向绑定，子组件要做的两件事情：
- 接收props;
- 触发父组件的自定义方法。
这里是有一个默认值的。如果父组件使用v-model来实现跟子组件的双向绑定，子组件默认可以接收到key为value的一个从父组件传过来的props属性，而且子组件可以通过触发父组件的input事件，并将value需要更新的值做为参数，是可以完成一个更新数据闭环的。
子组件接收到的key值和触发父组件自定义事件的名称都是可以配置的，如果不配置就是用的value和input。配置方法：在子组件的model属性中给prop和event属性赋值就行。
在这个场景下，父组件更新方法做的事情非常简单，数据是子组件调用方法的时候传递过来的，调用时机是子组件通知的，需要更新的就是v-model后面的响应式数据。因为这个方法做的事情太简单，所以就在编译v-model的时候内部完成了。
差异
表单元素和组件的双向绑定最大的差异，就在子组件的双向绑定，需要子组件去触发父组件的自定义事件更新。
其实也是根据应用场景不同来做的这个差异化，组件更新的时机本身就比较灵活，这个交予组件自己控制会更自由。而表单元素的应用场景比较简单，视图数据变化的时候自动触发父组件更新，这样用起来更简单。
语法糖
语法糖主要做的事情有3个：
给子组件传值；
内部给父组件生成一个事件回调函数，用来更新传给子组件的值；
⚠️ 这里稍微有点绕，子组件通知父组件更新父组件传给子组件的值。因为Vue是单向数据流，子组件是不能自己更新从父组件传过来的数据的。
如果是表单元素，数据变化会自动触发父组件事件回调函数。