v-model梳理

父组件：

这里是父组件 父组件的v-model：{{isShow}}

子组件：

props:{

value:{//可以直接通过value获取 在父页面v-model绑定给子组件上的值

 type:Boolean,

 default:true

},

}

官方解释：

等价于

用在组件上时

所以可以这样用：

父组件中：

子组件

props：{value:{}}

//通过input事件来使父组件的number+1

解释说明：

通过v-bind把父组件的数据绑定到了子组件的props属性中，而在props上默认用value取值，然后通过$emit触发事件input，因为v-model绑定的事件是input，故在子组件上触发了父组件的input事件，通过触发事件来进行传值，实现了父子组件数据的双向绑定，相对于直接使用v-bind以及自定义事件代码量有所减少

原理：

首先我们为每个vue属性用Object.defineProperty()实现数据劫持，为每个属性分配一个订阅者集合的管理数组dep；然后在编译的时候在该属性的数组dep中添加订阅者，v-model会添加一个订阅者，{{}}也会，v-bind也会，只要用到该属性的指令理论上都会，接着为input会添加监听事件，修改值就会为该属性赋值，触发该属性的set方法，在set方法内通知订阅者数组dep，订阅者数组循环调用各订阅者的update方法更新视图。