vue中封装动态添加css、js组件

1.remote-css.vue

<script>
/**
 * 引入远程css的组件，在页面中当组件使用
 * 可以在App.vue中全局引用，也可以在任意页面中单独引用
 * 用法：<remote-css :href=""></remote-css>
 *
 */
export default {
  name: "remote-css",
  components: {},
  href: { type: String, required: true },
  render(h) {
    return h("link", { attrs: { rel: "stylesheet", href: this.href } });
  },
};
</script>

2.remote-js.vue

<script>
/**
 * 引入远程css的组件，在页面中当组件使用
 * 可以在App.vue中全局引用，也可以在任意页面中单独引用
 * 用法：<remote-js :src=""></remote-js>
 *
 */
export default {
  name: "remote-js",
  components: {},
  src: { type: String, required: true },
  render(h) {
    return h("script", { attrs: { type: "text/javascript", src: this.src } });
  },
};
</script>