VUE使用/deep/报错的问题

4,134 阅读1分钟

在定义样式的时候不经意间发现我平时使用的/deep/竟然无效了,后来发现我以前的项目 style 中使用的是less,最近的项目使用的是scss,才找到的报错的原因,作为一个后端来说,只要不报错就可以了,至于lessscss的具体问题就没有深究

错误信息

image.png

错误代码

<style lang="scss" scoped>
/deep/ .add-policy{

}
</style>

解决方案

使用样式穿透的时候需要注意 less语言配合/deep/使用, scss语言可以使用::v-deep

less 语言使用/deep/
<style lang="less" scoped>
/deep/ .el-input--small .el-input__inner{
    height: 20px !important;
    line-height: 20px !important;
    font-size: 12px !important;
  }
<style>
scss 语言使用::v-deep
<style lang="scss" scoped>
::v-deep .el-radio-group {
  .el-radio {
    margin-right: 20px
  }
}
</style>