vue中根据条件动态引入css文件

在Vue中可以通过动态添加link标签的方式来引入CSS文件，具体实现如下：

1. 在组件中定义一个变量来存储CSS文件的路径，例如：

data() {
  return {
    cssPath: 'path/to/css/file.css',
  }
}

2. 在组件的mounted生命周期钩子函数中，创建一个link标签并动态添加到页面中，例如：

mounted() {
  const link = document.createElement('link')
  link.rel = 'stylesheet'
  link.href = this.cssPath
  document.head.appendChild(link)
}

3. 如果需要根据条件动态引入不同的CSS文件，可以通过计算属性来实现，例如：

computed: {
  cssPath() {
    return this.condition ? 'path/to/css/file1.css' : 'path/to/css/file2.css'
  }
}

其中，condition为条件判断语句，根据不同的条件返回不同的CSS文件路径。

需要注意的是，当组件销毁时，需要将动态添加的link标签从页面中移除，以避免影响其他组件的样式。可以在组件的beforeDestroy生命周期钩子函数中实现，例如：

beforeDestroy() {
  const link = document.querySelector(`link[href="${this.cssPath}"]`)
  link && link.parentNode.removeChild(link)
}