vue3中jsx组件如何异步加载

Question

普通的.vue文件直接可以利用defineAsyncComponent()异步，但对jsx函数组件失效

import { defineAsyncComponent } from 'vue';
//.vue组件正常
const load = defineAsyncComponent(() => import('./components/load/index.vue'));

//jsx函数组件不显示
const loading = defineAsyncComponent(() => import('@/components/loading'));

请问jsx函数组件如何使用defineAsyncComponent()呢

Answer 1

1.默认暴露可以直接
const loading = defineAsyncComponent(() => import('@/components/loading'));
2.分别暴露的情况下需要特殊处理
const loading = defineAsyncComponent(() => import('@/components/loading').then(({ loading }) => loading));