Vue3+Ts 组合API调用子组件方法

1、子组建定义方法,并对外暴露

<script setup lang="ts">

import {computed, reactive, ref,defineExpose} from "vue";

/**
 * 定义方法
 */
const initData = () => {
  console.info("initData")
}


/**
 * 对外暴露子组建方法
 */
defineExpose({
  initData
})

</script>

2、父页面导入组建

import type docSharePublish from "@/components/doc-share-publish/index.vue";

3、父亲页面定义组建

const docSharePublishRef = ref<InstanceType<typeof docSharePublish>>()

4、父亲页面调用子组建方法

docSharePublishRef.value.initData();

 

posted @ 2023-04-18 17:20  星空的轨迹  阅读(820)  评论(0)    收藏  举报