我想从 vuejs 和 laravel 的页面中删除一个脚本标签

Question

我正在为该组件中的更多功能添加一个特殊的脚本文件，但是当我更改组件时，我想删除脚本标签。

以下方法用于在vue组件中添加script标签

created() {
    this.dynamicallyLoadScript("/assets/libs/moment/moment.min.js");s
},
methods: {
    dynamicallyLoadScript(url) {
        var script = document.createElement("script");
        script.src = url;

        document.body.appendChild(script);
    }
}

现在，当我更改组件时，我想删除该脚本。帮我怎么做？

Answer 1

您可以为该脚本标签添加一个 id，稍后在 destroyed() 方法中，您可以让该脚本通过 id 调用它并删除它。

Answer 2

您可以收听 beforeDestroy 生命周期方法并从文档中删除脚本。

为此，您需要将您 appendChild 创建的 DOM 元素保存在您的 Vue 组件中，并删除 beforeDestroy 生命周期中的脚本标签。

methods: {
    dynamicallyLoadScript(url) {
        var script = document.createElement("script");
        script.src = url;

        this.scriptEle = document.body.appendChild(script);
    }
}

beforeDestroy() {
  document.body.removeChild(this.scriptEle);
}

我想从 vuejs 和 laravel 的页面中删除一个脚本标签

I want to remove one script tag from page in vuejs and laravel

javascript

vue.js

laravel-mix