使用场景
父组件传递的属性子组件想修改
v-model
习惯上表单元素用v-model
//父组件
<template>
<!--v-model是语法糖-->
<Input v-model="username">
<!--默认等效于下面这行-->
<Input :value="username" @input="(value)=>{username=value}">
</template>
//子组件
<input :value="value" @input="(e)=>{$emit('input',e.target.value)}"/>
.sync
sync修饰符的控制能力都在父级，事件名称也相对固定update:xx
//父组件
<template>
<!-- sync修饰符添加于v2.4，它能用于修改传递到子组件的属性，如果像下面这样写 -->
<Input :foo.sync="username">
<!-- 等效于下面这行，那么和v-model的区别只有事件名称的变化 -->
<Input :foo="username" @update:foo="(value)=>{username=value}">
</template>
//子组件
this.$emit('update:foo',value)
