vue 项目动态引入css文件(判断后加载对应的css文件)？

Question

vue 项目动态引入css文件(判断后加载对应的css文件)
每个页面都要重新加载

Answer 1

动态添加css

/**
 * 添加样式
 * @param css
 * @returns {HTMLStyleElement} 添加的样式
 */
export function addCustomStyle(css) {
  const style = document.createElement("style");
  style.appendChild(document.createTextNode(css));
  const head = document.getElementsByTagName("head")[0];
  head.appendChild(style);
  return style
}

这么使用

    // 添加样式
    this.style = addCustomStyle(style);

   // 如果想移除添加的样式
    this.style.remove()