导航:首页 > 编程语言 > vuejswindowonload

vuejswindowonload

发布时间:2025-07-23 00:11:26

A. vue外部js动态加载

vue加载远程(网络)js

vue项目中有时候会遇到加载远程(网络)js的情况,常用的方法有以下两种:

以加载在线的cesium为例

在组件中可以通过window.Cesium来获取加载的js,示例如下:

在main.js里注册组件

注意:注册组件一定要在newVue之前

在组件中使用:

这样使用比较灵活还能在加载完成和加载失败时做一些操作。

vue项目中插入外部js

script1.onload要在页面加载js之前写

···

constcenterRotationAd=document.getElementById("centerRotationAd");

···

VUE中如何动态编译js

需求:动态获取一段字符串类型的js脚本,动态编译它并且可以完美在vue中运行与之交互。

实现:动态编译js的方式有eval和newfunction

简单例子:

eval:

newfunction:

显然后者更利于扩展,详细了解区别可以参考链接内容:

要注意使用newFunction,在vue环境中直接赋值的方式函数作用域与赋值vue结构对象不同:

如何在.vue文件中引入外部js

Vue的createElement方法,简单的封装一个组件解决问题。

解决方法

第一版代码(直接在操作Dom)如下:

exportdefault{

mounted(){

consts=document.createElement('script');

s.type='text/javascript'

s.src=''

document.body.appendChild(s);

},

}

使用createElement方法:

exportdefault{

components:{

'dingtalk':{

render(createElement){

returncreateElement(

'script',

{

attrs:{

type:'text/javascript',

src:'',

},

},

);

},

},

},

}

//使用在页面中调用

终极方案

通过封装一个组件remote-js实现:

exportdefault{

components:{

'remote-js':{

render(createElement){

returncreateElement('script',{attrs:{type:'text/javascript',src:this.src}});

},

props:{

src:{type:String,required:true},

},

},

},

}

使用方法:

remote-jssrc=""remote-js

阅读全文

与vuejswindowonload相关的资料

热点内容
文件存在电脑的桌面容易丢失吗 浏览:486
哪些函数的数据区域要绝对引用 浏览:370
手机怎么扫描文件发送到电脑 浏览:464
emui40主题修改教程 浏览:585
app引流方法有哪些优缺点 浏览:944
文件中的选项卡找不到了怎么办 浏览:705
pdf文件编辑没水印 浏览:120
如何在手机编程软件上编程 浏览:897
苹果5ca1532怎么使用联通4G网络 浏览:510
aspnet网站源码下载vs2008 浏览:144
什么是应用最多的编程语言 浏览:184
java基础类型转换 浏览:53
word文件方框里打勾怎么做 浏览:785
资源大合派出所找不到文件 浏览:686
360网盘最大上传文件 浏览:604
英雄联盟624版本补丁 浏览:614
win10qq手机 浏览:266
linux常用文件类型类型符 浏览:282
网络老干部是什么意思 浏览:861
appstore怎么移回主屏幕 浏览:364

友情链接