vue $emit 父组件与子组件之间的通信(父组件向子组件传参)

1、首先新建一个子页面为 env.vue的文件(名字这里大家可以自取)

2、然后把子页面引入父页面,代码如图:

import env from '@/components/common/env'
export default { name: 'xxxxxxxxxxxxxxxx', components: { env }
}

在需要添加的地方写上<env></env>

<template scope="scope">
    <env :rowData="scope.row" v-on:envLookData="lookData"></env>
</template>

3、子组件页面代码如图:

export default {
   name: 'env',
    props: {
      rowData:Object    //props里面的 rowData:Obiect, 这个是 定义一个传值类型(props 可以是数组或对象,用于接收来自父组件的数据)
    },
    methods: {
      runTimeEnvFnc(){
        this.$emit("envLookData", this.rowData, this.rowData.productEnvVersion); //$emit是触发当前实例上的事件。"envLookData"是从父组件传递过来的值
      }
    }
}

 

posted @ 2017-08-22 15:17  盒子豪  阅读(2414)  评论(0编辑  收藏  举报