组件间的v-model .sync

v-model:

v-model一般用于input输入框 和下拉菜单 实现数据的双向绑定; 实现原理就是通过标签的value属性绑定变量, 再通过input事件来监听value的改变再赋值给变量实现双向绑定

组件之间的v-model

   <Myinput v-model="message"></Myinput>
   <Myinput :value="message" @input="message=$event"></Myinput> //$event是⼦组件传过来的值

.sync: 组件间.sync本质

<my-component :a.sync="value" :age.sync = "value2"/>
<!--等价于-->
<my-component 
  :a="value" 
  @update:a="(val) => value = val"
  :age="value2"
  @update:age="(val) => value2 = val"
/>

子组件写法