vue父子组件

父子组件之间，需要进行数据传输

父 ——> 子     props传递参数；       

子 ——> 父     emit方法传递数据 

父组件：

<template>
    <div>  
        <child :propsName="propsData" @vote="voteId"></child>
    </div>
</template>

<script>
    import child from '@/components/child';
    export default {
      name: 'detail',
      data () {
         return {
            propsData: { id: 25, name: 'Jack', age: 18}
        }
      }
    },
    methods:{
        voteId(id){
            console.log('子组件传递的参数id为：'+id);
        }
    },
    components:{
        child 
    }
</script>

子组件：

<template>
    <div>
        <div @click="vote(propsData.id)">{{ propsData.name }}</div>
    </div>
</template>

<script>
export default {
  name: "child",
  //props:['propsData'], //不验证数据类型
  props:{      //添加验证，例如必须传入对象
    propsData:{
      type: Obiect,
      default: {}
    }
  },
  methods:{
    vote(id){
      this.$emit('vote', id);
    }
  }
}
</script>