在我们开发Vue的应用过程中，有一个父子组件通信的需求是很常用的：父组件 Parent 存在属性 d ，通过参数 p 传输给子组件 Child ，我们希望 Child 组件能改变 Parent 的属性 d 。在没有修饰符 .sync 的情况下，我们的一般方法是这样的：

    1. 父组件监听子组件事件 **update:p** ,并且将参数 p 绑定为 d
    2. 子组件触发 **update:p** 事件并向该事件传入父组件属性 d 的新值
    3. 父组件的事件处理函数触发，处理函数根据传入的新值改变组件的属性 d

    具体代码如下：

    1. // Parent
    2. <template>
    3.     <Child :p="d" v-on:update:p="d = $event" />
    4. </template>
    5. <script>
    6. export default {
    7.     data() {
    8.       return {
    9.         d: 0
    10.     }
    11.   }
    12. }
    13. </script>
    14. // Child
    15. <template>
    16.     <div @click="$emit('update:p', 'p+1')">child</div>
    17. </template>
    18. <script>
    19. export default {
    20.   props:{
    21.       p: Number
    22.   }
    23. }
    24. </script>

    由于父组件的模式是固定的，所以Vue引入了 .sync 来简写这种模式，简写后的代码如下：

    1.     <Child :p.sync="d" />

    字面意义就是说子组件参数 p 值与父组件的属性 d 值同步(synchronize)，子组件调用 update:p 方法表面上是更新参数p，实际上是通过更新父组件的属性d来更新参数p，Vue把事件取名为这个是估计是想更通俗易懂一点。