1. <div id="app">
    2.     <div>{{bar}}</div>
    3.     <my-comp :foo.sync="bar"></my-comp>
    4.     <!-- <my-comp :foo="bar" @update:foo="val => bar = val"></my-comp> -->
    5. </div>
    6. <script>
    7.     Vue.component('my-comp', {
    8.         template: '<div @click="increment">点我+1</div>',
    9.         data: function() {
    10.             return {copyFoo: this.foo}
    11.         },
    12.         props: ['foo'],
    13.         methods: {
    14.             increment: function() {
    15.                 this.$emit('update:foo', ++this.copyFoo);
    16.             }
    17.         }
    18.     });
    19.     new Vue({
    20.         el: '#app',
    21.         data: {bar: 0}
    22.     });
    23. </script>

    说明：代码<my-comp :foo.sync="bar"></my-comp>会被扩展成<comp :foo="bar" @update:foo="val => bar = val"></comp>，就是一个语法糖。