vue组件内部引入外部js文件的方法
之所以要做这个是因为，在一个组件内部需要引入一个js文件来定位。如果放在index.html，这样每个组件都会有这个js。所以需要在组件内单独引入。
第一种操作Dom引入js：
exportdefault{
mounted(){
consts=document.createElement('script');
s.type='text/javascript';
s.src='你的需要的js文件地址';
document.body.appendChild(s);
},
}
第二种使用createElement方法：
exportdefault{
components:{
'remote-js':{
render(createElement){
returncreateElement(
'script',
{
attrs:{
type:'text/javascript',
src:'你的需要的js文件地址',
},
},
);
},
},
},
}
//使用
第三种封装一个组件：
importJs.js
//导入外部js
importVuefrom'vue'
Vue.component('remote-script',{
render:function(createElement){
varself=this;
returncreateElement('script',{
attrs:{
type:'text/javascript',
src:this.src
},
on:{
load:function(event){
self.$emit('load',event);
},
error:function(event){
self.$emit('error',event);
},
readystatechange:function(event){
if(this.readyState=='complete'){
self.$emit('load',event);
}
}
}
});
},
props:{
src:{
type:String,
required:true
}
}
});
//引入
import'common/importJs.js'
//使用
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。