vue3 动态加载组件

javascript 复制代码
//模版调用
<component :is="geticon(item.icon)" />

//引入
import { ref, onMounted, markRaw, defineAsyncComponent } from 'vue';


//异步添加icon图标组建
function geticon(params) {
    const modules = import.meta.glob('../components/icons/*.vue');
    const link = modules[`../components/icons/${params}.vue`]
    return markRaw(defineAsyncComponent(link))
}
相关推荐
Mintopia2 分钟前
🚀 Next.js 企业级文件上传方案全解
前端·javascript·全栈
光影少年4 分钟前
Promise状态和方法都有哪些,以及实现原理
javascript·promise·掘金·金石计划
雾岛听风来4 分钟前
k9s监控k8s集群工具
前端
用户87261342418515 分钟前
封装组件库并上传npm源
前端
Mintopia5 分钟前
🌐 Web3.0 时代:AIGC 如何赋能去中心化内容生态?
前端·javascript·aigc
鹏多多6 分钟前
前端项目eslint配置选项详细解析
前端·vue.js·react.js
然我7 分钟前
面试官:这道 Promise 输出题你都错?别再踩 pending 和状态凝固的坑了!(附超全解析)
前端·javascript·面试
bug_kada9 分钟前
让你彻底明白什么是闭包(附常见坑点)
前端·javascript
吴楷鹏9 分钟前
TypeScript 为什么要增加一个 satisfies?
前端·typescript
光影少年9 分钟前
js异步解决方案以及实现原理
前端·javascript·掘金·金石计划