本文實例講述了vue.js使用v-model實現父子組件間的雙向通信。分享給大家供大家參考，具體如下：

<template><div>  這是主頁面  <h1> {{num}}</h1>  <button @click="handleMins">-1</button>    <hr>    <!--      作者：786905664@qq.com      時間：2017-09-24      描述：局部組件      -->    <com v-model="num"></com>  </div></template>

<script>import son from './test1'var com={template:'<div>{{msg}}<button @click="handleAdd">+1</button>{{currentNum}}</div>',data(){return{msg:'我是局部組件',currentNum:this.value}},props:{value:{//這里必須是valuetype:Number}},methods:{handleAdd(){this.currentNum++;this.$emit('input',this.currentNum)//這里必須是input}},watch:{value(val){this.currentNum=val}}}export default {components:{com},data(){return{msg:'',show:'',num:0}},methods:{showson(e){this.show=e},handleMins(){this.num--}}}</script>

希望本文所述對大家vue.js程序設計有所幫助。