vue3+ts父组件如何获取调用子组件的方法，setup lang='ts'。

一. 子组件

<script setup lang='ts'>

const jsonStr = '123'

const setJsonStr = (str: string) => {
    console.log(str)
}

const getJsonStr = () => {
    return jsonStr
}

defineExpose({ setJsonStr, getJsonStr }) //最重要

</script>
<template>
    <div>
        子组件
    </div>
</template>
<style scoped>
</style>

二. 父组件

<script setup lang='ts'>
import { onMounted, ref, nextTick } from 'vue';
import JsonEditor from './JsonEditor.vue'//子组件

const jsonEditor = ref<{ 
        setJsonStr(str: string): undefined;
        getJsonStr(): string 
    }>(); //最重要

const loadJson = async (str: string) => {
    await nextTick()
    if (!jsonEditor.value) return
    jsonEditor.value.setJsonStr(str)
}

onMounted(() => {
    loadJson('调用儿子的setJsonStr')
})

</script>
<template>
    <div>
        父组件
        <JsonEditor ref="jsonEditor"></JsonEditor>
    </div>
</template>
<style scoped>
</style>