导航:首页 > 编程语言 > 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相关的资料

热点内容
网络用语粉丝阅读什么意思 浏览:333
红头文件怎么打印 浏览:94
热血江湖130刺客升级 浏览:106
jsp页面放大镜技术介绍 浏览:101
网络编程udp 浏览:148
加密压缩文件如何打开 浏览:56
微软编程软件有哪些 浏览:736
linux目录中创建文件夹权限设置密码 浏览:759
word文档正式文件模版 浏览:247
linux文件系统的类型是 浏览:111
苹果的无线传输文件找不到了 浏览:102
密件文件名能出现在通知吗 浏览:832
编写一个web应用程序 浏览:350
哪些场所网络好 浏览:171
华为手机怎么找到以前安装过的app 浏览:100
49块一单约人陪的app是什么 浏览:570
ug文件格式图片 浏览:24
兴趣班编程课是学什么 浏览:879
怎么才能加微信医药群 浏览:601
微信表情小萝莉亲吻 浏览:876

友情链接