vue2父子组件通信一般有3种方式
1、props+自定义事件
2、props+sync修饰符
3、props+v-model
因为第一种方式，还需要在父组件methods中声明方法去改变值，显得比较麻烦。
所以推荐使用第二种或者第三种方式。
如果是改变多个值就使用第二种方法，如果只是改变一个值那么就使用第三种方法。

方法一：props+自定义事件

父组件 Demo

  <div id="demo">
      <input type="text" v-model="name">
        <!--子组件传递过来的参数由自定义事件绑定的方法接收-->
      <demo-child :nameFather="name" @newData="newName"></demo-child>
  </div>

import DemoChild from '@/components/DemoChild'
export default {
    data(){
        return {
            name:'nihao'
        }
    },
    components:{
        DemoChild
    },
    methods:{
       //因此参数value是  '这是子组件传递过来的数据'
        newName(value){
            this.name=value
        }
    }
}

子组件 DemoChild

<template>
    <div id="demo_child">
        <p @click="change">DemoChild组件：{{nameFather}}</p>
    </div>
</template>

export default {
    //接收属性nameFather
    props:{
        nameFather: String
    },
    methods:{
        change(){
            //触发父组件中的自定义事件newData ,  this.$emit（'需要触发的自定义事件' [,'需要传递的参数']）
            this.$emit('newData','这是子组件传递过来的数据')
        }
    }
}

方法二：props+sync修饰符

父组件 Demo

  <div id="demo">
      <input type="text" v-model="name">
      <demo-child :nameFather.sync="name"></demo-child>  
  </div>

import DemoChild from '@/components/DemoChild'
export default {
    data(){
        return {
            name:'nihao'
        }
    },
    components:{
        DemoChild
    }
}

是子组件 DemoChild

    <div id="demo_child">
        <p @click="change">DemoChild组件：{{nameFather}}</p>
    </div>

export default {
    props:{
        nameFather: String
    },
    methods:{
        change(){
            //触发父组件自定义属性nameFather的更新，this.$emit（'update:父组件需要更新的自定义属性'，'更新后的属性值'）
            this.$emit('update:nameFather','这是子组件传递过来的数据')
        }
    }
}

方法三：props + v-model

父组件 Demo

  <div id="demo">
      <input type="text" v-model="name">
      <demo-child v-model="name"></demo-child>
      
  </div>

import DemoChild from '@/components/DemoChild'
export default {
    data(){
        return {
            name:'nihao'
        }
    },
    components:{
        DemoChild
    }
}

子组件 DemoChild

    <div id="demo_child">
        <p @click="change"> DemoChild组件  {{nameFather}}</p>
    </div>

export default {
    //声明model
    model:{
        prop:'nameFather',   //这个prop的值就是自定义的props属性,所以这里是'nameFather'
        event:'modelChange'  //model绑定的事件名，自己随意取
    },

    props:{
        nameFather: String   //自定义props属性，nameFather  
    },

    methods:{
        change(){
            //这里的第一个参数是model里的event,所以这里是'modelChange'  第二个参数是传递过去的值
            this.$emit('modelChange','这是子组件传递过去的数据')
        }
    }
}