-
-
Notifications
You must be signed in to change notification settings - Fork 9k
Description
Vue version
3.3.9
Link to minimal reproduction
https://stackblitz.com/edit/vitejs-vite-twm44h?file=src%2Fcomponents%2Fcommand.js
Steps to reproduce
import { h, render } from 'vue'
// 弹层组件
const componentMap = {
CustomDialog: defineAsyncComponent(
() => import('@/components/CustomDialog.vue')
)
}
export default function useCommandDialog() {
function showDialog(config: IDialogCommandConfig) {
const component = componentMap[config.component]
const mountedEl = (config.container || document.body.querySelector('#app')) as HTMLElement
const componentVnode = h(component, { ...config.props })
console.log('commandDialog', componentVnode, component)
// // 挂载弹窗组件
render(componentVnode, mountedEl)
setTimeout(() => {
if (componentVnode.component && componentVnode.component.proxy) {
const AsyncComInstance = componentVnode.component
const realComponent = AsyncComInstance.subTree.component
// console.log('render', AsyncComInstance.subTree)
if (realComponent && realComponent.isMounted && realComponent.exposed) {
realComponent.exposed[config.openFnName] && realComponent.exposed[config.openFnName]()
}
}
}, 80)
}
return {
showDialog
}
}
What is expected?
希望正常显示弹窗组件和组件引用的UI组件
What is actually happening?
报错:
Failed to resolve component: a-select
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement
System Info
No response
Any additional comments?
No response