Vue文件引入.js文件的组件

转载于 2018-08-29 15:24:00 发布 · 129 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/likewpp/p/9554576.html

文章标签：

#javascript #ViewUI

本文介绍如何在Vue中创建一个自定义的远程脚本组件，该组件能够加载外部JavaScript文件，并监听其加载和错误事件。通过props传递src属性，实现动态加载不同来源的脚本。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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
        }
    }
});