之所以要做这个是因为，在一个组件内部需要引入一个js文件来定位。如果放在index.html，这样每个组件都会有这个js。所以需要在组件内单独引入。第一种操作 Dom引入js：
export default {
mounted() {

const s = document.createElement('script');

s.type = 'text/javascript';

s.src = '你的需要的js文件地址';

document.body.appendChild(s);
},
}

export default {
mounted() {

const s = document.createElement('script');

s.type = 'text/javascript';

s.src = '你的需要的js文件地址';

document.body.appendChild(s);
},
}
第二种使用 createElement 方法：
export default {
components: {

'remote-js': {

render(createElement) {

return createElement(

'script',

{

attrs: {

type: 'text/javascript',

src: '你的需要的js文件地址',

},

},

);

},

},
},
}
// 使用 在页面中调用

export default {
components: {

'remote-js': {

render(createElement) {

return createElement(

'script',

{

attrs: {

type: 'text/javascript',

src: '你的需要的js文件地址',

},

},

);

},

},
},
}
// 使用 在页面中调用
第三种封装一个组件：
importJs.js
// 导入外部js
import Vue from 'vue'

Vue.component('remote-script', {

render: function (createElement) {

var self = this;

return createElement('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'
// 使用


// 导入外部js
import Vue from 'vue'

Vue.component('remote-script', {

render: function (createElement) {

var self = this;

return createElement('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'
// 使用

以上就是本文的全部内容，希望对大家的学习有所帮助。