技术栈

vue3 动态加载组件

爱咋咋地12024-08-02 1:37
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))
}
上一篇:若依替换首页上的logo
下一篇:深入理解C语言结构体
相关推荐
王码码2035
37 分钟前
Flutter for OpenHarmony:Flutter 三方库 bluez 玩转 Linux 风格的蓝牙操作(蓝牙底层互操作)
linux·运维·服务器·前端·flutter·云原生·harmonyos
暴力袋鼠哥
2 小时前
基于 Spring Boot 3 + Vue 3 的农产品在线销售平台设计与实现
vue.js·spring boot·后端
chilavert318
3 小时前
技术演进中的开发沉思-371:final 关键字(中)
java·前端·数据库
2301_81699788
3 小时前
Vite构建工具
前端
yuki_uix
4 小时前
深入理解 reduce:从面试题到设计思维
前端
凌云拓界
4 小时前
TypeWell全攻略(二):热力图渲染引擎,让键盘发光
前端·后端·python·计算机外设·交互·pyqt·数据可视化
coding随想
4 小时前
TypeScript 高级类型全攻略:从“可表达性”到“类型体操”的实践之路
前端·javascript·typescript
大时光
4 小时前
gsap -滚动插件 ScrollTrigger 简单demo
前端
热门推荐
01GitHub 镜像站点02AI Agent 平台横评:ZeroClaw vs OpenClaw vs Nanobot03Claude Code + GLM4.7 避坑指南:解决 Unable to connect to Anthropic services04【OpenClaw 本地实战 Ep.3】突破瓶颈:强制修改 openclaw.json 解锁 32k 上下文记忆05Clawdbot部署教程:解决‘gateway token missing’授权问题的完整步骤06配置 OpenClaw 使用 Ollama 本地模型07AI 规范驱动开发“三剑客”深度对比:Spec-Kit、Kiro 与 OpenSpec 实战指南08openClaw安装飞书插件|核心踩坑:spawn EINVAL 错误终极解决指南09OpenClaw 安装之(三)DeepSeek模型接入配置和详细配置参数10全面体验 Grok API 中转站(2025 · Grok 4 系列最新版)