vue 组件间数据传递

//父组件
<template>
　　<Product-list @son-fun（子组件中定义的$emit方法名，用来接收子组件中传递来的数据）='goDetil' :goods(子组件props内的goods)='goods(父组件要传递的数据)'></Product-list>
</template>
<script>
　　import ProductList from '../../components/Product_information_list.vue'　　//引入子组件
　　export default {
　　　　data(){
　　　　　　return{
　　　　　　　　goods:[xxx]
　　　　　　}
　　　　},
　　　　components: {
            'Product-list': ProductList　　　　//注册子组件
        },
　　　　methods:{
　　　　　　goDetil(id) {
               console.log(id)
            }
　　　　}
　　}
</script>

 

//子组件
<template>
    <div @click='navigator(goods.id)'>{{goods（props内的goods，父组件传递来的数据）}}</div>
</template>
<script>
    export default {
        props:['goods'],
        data() {
            return {
            };
        },
        mounted() {
　　　　　　navigator(id){　　　　//通过this.$emit方法向父组件传递数据
                this.$emit('son-fun',id)
            }
        },
        methods:{
           
        }
    }
</script>