sync
vue 修饰符sync的功能是：当一个子组件改变了一个 prop 的值时，这个变化也会同步到父组件中所绑定。如果我们不用.sync，我们想做上面的那个弹窗功能，我们也可以props传初始值，然后事件监听，实现起来也不算复杂。
我们常规的做法是这样的：
---main.vue---
<template>
<child :money="total" v-on:update:money='total=$event'></child>
</template>
<script>
import Child from "./Child.vue";
export default {
data() {
return { total: 10000 };
},
components: { Child }
};
</srcipt>
---child.vue---
<template>
<div class="child">
<button @click="$emit('update:money', money-100)">
<span>花钱</span>
</button>
</div>
</template>
<script>
export default {
props: ["money"]
};
</script>
.sync则是一个语法糖，主要的作用就是帮我们简化了父组件监听子组件操作prop属性的行为。 将简化为
---main.vue变化前---
<template>
<child :money="total" v-on:update:money='total=$event'></child>
</template>
---main.vue变化后---
<template>
<Child :money.sync="total">
</template>
