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))
}
相关推荐
Wect4 分钟前
LeetCode 92. 反转链表II :题解与思路解析
前端·算法·typescript
Wect5 分钟前
LeetCode 138. 随机链表的复制:两种最优解法详解
前端·算法·typescript
像颗糖7 分钟前
OpenSpec 和 Spec-Kit 踩了 27 个坑之后,于是我写了个 🔥SuperSpec🔥 一次性填平
前端·后端
Jing_Rainbow10 分钟前
【React-10/Lesson94(2026-01-04)】React 性能优化专题:useMemo & useCallback 深度解析🚀
前端·javascript·react.js
白中白1213815 分钟前
Vue系列-3
前端·javascript·vue.js
沛沛老爹15 分钟前
Vue3+TS实战:基于策略模式的前端动态脱敏UI组件设计与实现
前端·ui·vue3·数据安全·策略模式·动态渲染·前端脱敏
陈随易22 分钟前
CDN的妙用,隐藏接口IP,防DDOS攻击
前端·后端·程序员
明月_清风22 分钟前
单点登录(SSO)在前端世界的落地形态
前端·安全
九丝城主26 分钟前
1V1音视频对话2--Web 双浏览器完整通话测试(强制 relay)
前端·音视频
C澒26 分钟前
以微前端为核心:SLDSMS 前端架构的演进之路与实践沉淀
前端·架构·系统架构·教育电商·交通物流