与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>