vue3父组件调用子组件里面的方法

与vue2一样定义ref

<template>
  <!-- 子组件 -->
  <User name="zs" :age="age" ref="user"></User>
</template>

js中定义ref的变量并且返回

import {ref,onMounted} from 'vue'
export default {
  setup(props,content) {
    const age = ref(0)
   // const user = ref<null | HTMLElement>(null); // ts用法
    const user = ref(null) // js用法
    onMounted(() => {
      user.value.open('lisi') // 调用子组件中的open方法
    })
    return {
      age,user
    }
  }
}

在setup语法糖中使用

子组件

<script setup>
// setup 语法糖模式给父组件传递方法
// 第一步：定义子组件里面的方法
 const getLineEcharts = (config) => {
// }
// 第二步：暴露方法
 defineExpose({ getLineEcharts })
</script>