vue $parent的用法

$parent指向调用该组件的父组件实例，注意，是直接，如果多层，需要$parent.$parent....，通过$parent调用父组件的props、 data或者methods等，比如table-body.vue单文件组件中有一个handleMouseIn方法，而table.vue单文件组件在<template>中调用了<table-body />组件：

table-body.vue,代码借鉴iview

handleMouseIn (_index) {
    //这时候this.$parent指向<table />父组件，并调用父组件的handleMouseIn()方法
    this.$parent.handleMouseIn(_index);
},

table.vue中,代码借鉴ivew

<template>
    <table-body />
</template>

import tableBody from './table-body.vue';
const COMPONENT_NAME='table';
export default {
   name:COMPONENT_NAME,
   components: { tableBody },
   methods: {
      //<table-body />父组件(table.vue中)中也有一个handleMouseIn方法
      handleMouseIn (_index) {
         if (this.disabledHover) return;
         if (this.objData[_index]._isHover) return;
         this.objData[_index]._isHover = true;
      }
    }
}

然后通过 $parent层叠可以一层一层地往上追溯各级父组件，比如this.$parent.$patent.grandfatherDataKey。