雙向繫結有兩種方式：

1. v-model 繫結方式，

子元件實現方式

<template>
 <div>
  <button @click = "plusClick">+</button>
  <button @click = "minuClick">-</button>
  </div>
</template>
<script >
import Vue from 'Vue';
  export default {
  	name: 'count',
    model: {
      prop: 'count', //v-model繫結的資料，相當於別名，可以和父元件中的變數名稱不一樣。
      event: 'mySign' // 自定義元件傳送的訊號名稱。
    },
   props: {
      count: '',// 必須和model 物件中的變數對應。
      age: ''
    },
    data () {
      return {
        incount: this.age
     }
   },
   methods:{
    plusClick(){
      this.incount++;
      this.$emit('mySign', this.incount);

   }, 
   minuClick(){
     this.incount--;
      this.$emit('mySign', this.incount);
   }
 },
父元件呼叫：
 

<div>age out: {{age}}</div>
<count v-model="age" :age="age"></count>

2。sync

父元件：     

 <child2 :name.sync="name"></child2>

<template>
 <div>
    child2 in : <input type="text" v-model="localName"/>
  </div>
</template>

<script >
import Vue from 'Vue';
  export default {
  name: 'child2',
    props:['name'],
    data () {
      return { 
        localName: this.name
     }
   },
   watch:{
    localName: function(newVal,old) {
      this.$emit('update:name', newVal);
      console.log("new:"+newVal+";old="+old);
    }
   },