Como o Vue importa arquivos JS/css remotos
- Cenário do aplicativo: Por exemplo, se você deseja usar o ícone do vetor Alibaba sozinho em um determinado projeto, mas não deseja baixá-lo, mas deseja usar recursos externos (cdn ... etc.) diretamente e a importação é não permitido, então você pode usar este método! (O método é bom para gravar uma vez)
Use o método createElement do Vue:
export default {
components: {
"remote-css": {
render(createElement) {
return createElement("link", {
attrs: { rel: "stylesheet", href: this.href },
});
},
props: {
href: { type: String, required: true },
},
},
"remote-js": {
render(createElement) {
return createElement("script", {
attrs: { type: "text/javascript", src: this.src },
});
},
props: {
src: { type: String, required: true },
}
}
}
}
- É realizado encapsulando um componente remote-js.
Depois é só chamar direto na página O(∩_∩)O
<remote-css href="https://at.alicdn.com/t/font_2307826_i7ewj7yiv2k.css"></remote-css>
<remote-js src="https://at.alicdn.com/t/font_2307682_is3un805urb.js"></remote-js>