1、使用ref属性(推荐方式)

在子组件上添加ref属性

<template>
  <div>
    <Child ref="childRef"></Child>
    <button @click="isgetlist">调用子组件方法</button>
  </div>
</template>
<script setup>
    import { ref } from 'vue';
    import Child from './Child.vue';
    const childRef= ref(null);
    const isgetlist= () => {
      if (childRef.value) {
        // 假设子组件有一个名为childMethod的方法
        childComponentRef.value.getlist();
      }
    };
</script>

子组件暴露想要父组件调用的事件 

<template>
  <div>
    <h2>子组件</h2>
  </div>
</template>
<script setup>
    const getlist= () => {
      console.log('子组件的方法被调用了');
    };
    // 将方法暴露给父组件
    defineExpose({
      getlist
    });
</script>

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐