<div id="app">
  <child :app="app" @on-app-change="onAppChange"></child>
  <button @click="appMethod">{{ app }}</button>
</div>

<script src="http://cdn.bootcss.com/vue/2.1.10/vue.min.js"></script>
<script type="application/javascript">
    Vue.component('child', {
      template: '<button @click="childMethod">{{ app }}</button>',
      props: ['app'],
      data: function () {
        return {
          // 外部屬性只讀不可寫(xiě)，增加中間變量
          myApp: this.app
        };
      },
      watch: {
        // 監(jiān)聽(tīng)外部屬性的變化
        app(val) {
          this.myApp = val;
        },
        // 中間變量改變向上傳遞通知
        myApp(val) {
          this.$emit("on-app-change", val);
        }
      },
      methods: {
        // 改變中間變量值
        childMethod: function(){
          this.myApp++;
        }
      },
    })
    new Vue({
      el: '#app',
      data: {
        app: 0
      },
      methods: {
        appMethod: function () {
          this.app++;
        },
        // 定義方法，用于接收子組件中的通知
        onAppChange(val) {
          this.app = val;
        }
      }
    })
</script>

參考：如何在Vue2中實(shí)現(xiàn)組件props雙向綁定