typescript 的动态引入组件
环境: Arco Pro + Vue3
vite自身对动态字符串形式的组件引入是有限制的, 以下写法会报错


官方文档中也对此有做说明, 只能通过固定形式去引用

以下形式不会报错, 但这种固定格式的局限性非常大, 同时, 如果使用下方注释的写法, 虽然会警告, 但开发环境中依然可以正常执行

于是考虑了在外部定义对象, 现将组件引入到外部对象中, 再引用这个对象, TS使用映射来处理

这样就能在组件中通过提供对象上对应的属性, 来导入需要使用的组件


不过这种方法需要自己先在外部文件中手动按需导入组件, 但对组件得路径和名称都没有限制,不知道有没有更便捷的方法, 萌新一枚
typescript 的动态引入组件的更多相关文章
- Vue动态创建组件方法
组件写好之后有的时候需要动态创建组件.例如: 编辑文章页面,正文是一个富文本编辑器,富文本编辑器是一个第三方的组件,点击添加章节的时候需要动态的创建一个富文本编辑器这个时候怎么处理呢. 富文本编辑器也 ...
- 解决基于TypeScript 的 RN项目相对路径引入组件的问题
一.前言 在开发RN项目时,经常会要使用这样的方式(../../../)来引入组件,感觉非常繁琐,如果项目结构层级比较多,引入的头部更加分不清. 那有没有一种方案和vue项目一样,经过配置后简写路径, ...
- Angular使用总结 --- 通过指令动态添加组件
之前自己写的公共组件,都是会先引入,需要调起的时候再通过service控制公共组件状态.值.回调函数什么的.但是有一些场景不适合这种方式,还是动态添加组件更加好.通过写过的一个小组件来总结下. 创建组 ...
- jsp静态、动态引入其他jsp
1. <%@ include file="page.jsp"%> /*静态引入,内容必须写成固定值*/ 在servlet容器转化jsp为servlet时,将引入的 ...
- Java 动态编译组件 & 类动态加载
1.JDK6 动态编译组件 Java SE 6 之后自身集成了运行时编译的组件:javax.tools,存放在 tools.jar 包里,可以实现 Java 源代码编译,帮助扩展静态应用程序.该包中提 ...
- 动态创建组件TEdit
//动态创建组件TEdit procedure TForm1.FormMouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftSt ...
- Delphi动态创建组件,并释放内存
开发所用delphi版本是xe2,效果图如下: 代码如下: ---------------------------------------------------------------------- ...
- Angular动态创建组件之Portals
这篇文章主要介绍使用Angular api 和 CDK Portals两种方式实现动态创建组件,另外还会讲一些跟它相关的知识点,如:Angular多级依赖注入.ViewContainerRef,Por ...
- 【Vue.js】vue引入组件报错:该组件未注册?
[Vue warn]: Unknown custom element: <QuestionnaireOption> - did you register the component cor ...
- android动态设置组件LayoutParams
开发中经常用到动态设置组件的LayoutParams,之前开发遇到的问题如下: LinearLayout.LayoutParams params = new LinearLayout.LayoutPa ...
随机推荐
- Docker-Compose实战<下篇>
本文是在上一篇文章的基础上做的一些内容追加,上文最后截止内容是docker-compose build将镜像生成完成.接下来我将继续写启动相关服务,访问服务以及常用命令使用等. 1 启动镜像 使用命令 ...
- AI 智能搜索 开源hanlp实现
AI智能搜索 通过网络资源可知有很多种开源方式实现智能搜索,其中hanlp在GitHub中响应居高 参考链接: https://www.hanlp.com/ Java版:https://github. ...
- tomcat 2 - 默认连接器精简版
tomcat 将一个包中所有类使用的错误信息存储在 properties 文件中,每个包有一个 properties 文件.每个 properties 文件都是用 org.apache.catali ...
- 在MyBatis-Plus整合dynamic-datasource @DS失效
因为是事务导致的 解决方案: 1.删除事务 2.使用分布式事务 3.修改事务的传播机制 3.使用DS的本地事务 @DSTransactional 但切记不可和Spring的事务共存 附传播机制 事务传 ...
- 2022-3-10内部群每日三题-清辉PMP
1.一位项目经理得知,由于持续的罢工,该项目的进口设备尚未被海关放行.项目经理首先应该怎么做? A.执行定性风险分析 B.执行定量风险分析 C.与团队一起审查风险影响 D.实施风险应对计划 2.一位团 ...
- axios请求拦截封装理解
<p>全局处理请求.响应拦截的处理,常见处理请求动画,错误码</p> <p>import axios from 'axios'</p> <p> ...
- 《Unix/Linux系统编程》第十三章学习笔记 20201209戴骏
TCP/IP协议 从字面意义上讲,有人可能会认为 TCP/IP 是指 TCP 和 IP 两种协议.实际生活当中有时也确实就是指这两种协议.然而在很多情况下,它只是利用 IP 进行通信时所必须用到的协议 ...
- AD9834配置
SPI设置 注意,虽然手册上CPOL(CLK空闲时电平)为低,但实测是是高电平 连接 SYNC 为片选引脚,使用时拉低 FSE/PSE为频率与相位寄存器选择,均拉低即可 void SPI_Write_ ...
- GraalVM & Spring Boot初体验
前言 这两天封在家里,一直在琢磨想去把这个博客项目改成微服务的形式.不过就目前而言我的服务器内存放好几个Java进程是吃不消的,原因在于一个独立的JVM所占用的内存资源太吃内存.不过在云原生时代,使用 ...
- Android中的特殊权限
AndroidManifest中定义的权限分为普通权限,危险权限和特殊权限. 普通权限指的是不会威胁到用户的安全和隐私的权限,只需要在AndroidManifest中声明一下就能直接使用. 危险权限指 ...