Vue3+TSX项目动态导入js文件,挂载到window全局作用域中

历史小剧场

国家外患,振古有闻。赵宋末造,代于蒙古,神州陆沈,几及百年。我高皇帝,应时崛起,廓清中土,日月重明,河山再造,光复大义,昭示来兹。不幸季世俶扰,国力罢疲,满清乘间,入据中夏。嗟我邦人,诸父兄弟,迭起迭踣,至于二百六十有八年。呜呼!我高皇帝,时怨时恫,亦二百六十有八年也。岁在辛亥八月,武汉军兴,建立民国。义声所播,天下响应,越八十有七日,既光复十有七省,国民公议,立临时政府于南京。文以薄德,被推为临时大总统,瞻顾西北,未尽昭苏,负疚在躬,尚无以对我高皇帝在天之灵。迩者以全国军人之同心,士大夫之正谊,卒使清室幡然悔悟,于本月十二日宣告退位。从此中华民国完全统一,邦人诸友享自由之幸福,永永无已,实维我高皇帝光复大义,有以牖启后人,成兹鸿业。文与全国同胞至于今日,始敢告无罪于我高皇帝。敬于文奉身引退之前,代表国民,贡其欢欣鼓舞之公意,惟我高皇帝实鉴临之。敬告。-------孙中山《祭明孝陵文》

前言

最近,在一个需求中,我们这边需要和第三方厂商对接,第三方给了我方一个js文件,需要我方这边调用该文件中的某一个方法进行数据交互,但是我们这边使用的是Vue3+TS的项目。在最开始,我把JS文件转成了TS,然后将需要调用的文件export出去,然后我在TSX业务组件中去import,然后再进行调用,但是出现了一点问题。且第三方这个有很多问题,然后一下改这改那,我这边也比较繁琐。然后我就不转了,直接讲js文件挂载到window全局作用域中。但是,这里需要注意作用域的概念,为了避免这个js文件中的一些方法可能与我整个项目中一些全局变量所冲突,所以,我用了一个匿名函数将整个js文件中的内容包裹起来,然后将需要调用的方法return出去。

修改js文件放到项目静态文件目录下 assets

js 复制代码
window.$hlyy = function () {
	.... 原来的js文件中的内容
	return {
		PharmacistCheck.  // 业务组件需要调用的方法
	}
}

在业务组件中setup()函数中动态导入

js 复制代码
export default defineComponent({
	setup() {
		import("@/assets/js/hlyy3.js" as string);
	}
})

在浏览器环境中验证

相关推荐
TE-茶叶蛋2 分钟前
深入研究 yudao-framework 模块:Java 编程能力提升指南
java·开发语言
打小就很皮...4 分钟前
基于Python + LangChain + 通义千问的聊天机器人实战
前端·langchain·机器人·千问
逻辑驱动的ken10 分钟前
Java高频考点场景题24
java·开发语言·面试·职场和发展·求职招聘
兔小盈20 分钟前
多线程-(五)线程安全之内存可见性
java·开发语言·多线程
REDcker24 分钟前
个人博客网站建设指南 Markdown资产化与静态站选型部署
前端·后端·博客·markdown·网站·资产·建站
zhangfeng113331 分钟前
小龙虾 wordbuddy 安装浏览器控制器 agent-browser npm install -g agent-browse
前端·人工智能·npm·node.js
徐小夕1 小时前
100小时,我做了一款AI CAD建模软件,开源!
前端·vue.js·github
Bigger1 小时前
因为看不懂小棉袄的画,我写了个 AI 程序帮我“翻译”她的世界
前端·人工智能·ai编程
yaoxin5211231 小时前
400. Java 文件操作基础 - 使用 Buffered Stream I/O 读取文本文件
java·开发语言·python
折哥的程序人生 · 物流技术专研1 小时前
《Java面试85题图解版(二)》进阶深化上篇:并发编程 + JVM
java·开发语言·后端·面试