vue父组件点击事件再调用子组件methods里的方法

405 阅读1分钟

父组件

<template>
  <div>
 
          <el-tabs
            v-model="reparatActiveName"
            class="base-title"
            @tab-click="checkTab"
          >
            <el-tab-pane
              :label="item.title"
              :name="item.name"
              v-for="(item, index) in reparationTabPanes"
              :key="index"
            >
              <el-row>
                <el-col :span="24">
                  <claimInfo-accidentInfo
                    :clmnum="clmnum"
                    :claimtype="claimtype"
                    ref="accidentInfo"
                  ></claimInfo-accidentInfo>
                </el-col>
             </el-tab-pane>
           </el-tabs>
             
  </div>
</template>
<script>
importclaimInfo-accidentInfo  from './claimInfo-accidentInfo.vue';
export default {
  components: {
    claimInfo-accidentInfo
  },
  data() {
    return {
     
    };
  },
  medthods: {
//调用子组件的方法,传递参数
    checkTab() {  
      conslo.log(this.$refs.accidentInfo[0])
      可以先log一下,里面包含组件的函数
      //调用组件方法
      this.$refs.accidentInfo[0].getaccidentInfo()
    }
  }
};
</script>

子组件

methods:{
    //子组件方法
    getaccidentInfo(){}
}