关于v-model以及父子间值同步的使用

父组件

<template>
    <div id="fat">
        <input type="text" v-model="fatherValue" />
        <!--子传父事件，父传子props-->
        <son @fatAct="sonAct" :fatVal="fatherValue"></son>
    </div>
</template>
<script>
//  引入子组件
import Son from './Son'
export default {
  components:{
    Son
  },
  data(){
    return {
      fatherValue:''
    }
  },
  methods:{
    fatAct: function (childValue) {
        // childValue就是子组件传过来的值
        this.fatherValue = childValue
      }
  }
}
</script>
<style></style>

子组件

<template>
    <div id="son">
        <input type="text" v-model="sonValue" />
    </div>
</template>
<script>
export default {
  props:{
    fatherValue:{
      type:String,
      default:function(){
        return ''
      }
    }
  },
  computed:{
    sonValue:{
      get:function(){
        return this.fatherValue
      },
      set:function(value){
        this.$emit("sonAct",value);
      }
    }
  }
};
</script>
<style></style>