el-dialog 子组件无法通过$parent 访问父组件方法属性 解决方法

• 需求： 子组件需要动态获取父组件某个属性或者动态调用父组件方法

// 父组件
<template>
   <el-dialog>
        <son @return-prop="getName"/>
    </el-dialog>
</template>
<script>
...
  data() {
    return {prop: 'parent'}
  },
  methods:{
      getName(callback){
        ... 
        callback(this.prop) //调用此回调
      }
  }
...
</script>

子组件 son 通过emit 传参（回调）进行处理

<template>
   <div v-text="name"/>
</template>
<script>
...
  data() {
    return {name: ''}
  },
  methods: {
      handleClick() {
        console.log(this.$parent) // VueComponent el-dialog
        console.log(this.$parent.name) // undefined 这里name只是做示例，实际业务中，我在子组件中想获取dialog 某个动态属性，无法获取才发现的这个问题
        this.$emit('return-prop', prop=> { this.name = prop})
      }
  }
...
</script>

标签：el,return,name,parent,...,prop,组件
来源： https://www.cnblogs.com/gongxiansheng/p/16572893.html