vue3使用less中:deep不生效

vue3使用less中:deep不生效

  • 前言
  • 1、使用deep没有效果写在某个标签下的
  • 2、加scoped,:deep失效

前言

vue3 淘汰了 ::v-deep 要修改样式的类名 { 内容 }
vue3 采用 :deep(要修改样式的类名) { 内容 }
vue3对deep的官方讲解

1、使用deep没有效果写在某个标签下的

错误写法
vue3使用less中:deep不生效_第1张图片
正确写法
将deep单独放置并指定标签
vue3使用less中:deep不生效_第2张图片

2、加scoped,:deep失效

在 vue3 中,需要vue3的template里加上父标签,并在less中使用父标签包裹 要穿透的样式内容
vue3使用less中:deep不生效_第3张图片

错误写法
vue3使用less中:deep不生效_第4张图片
正确写法
vue3使用less中:deep不生效_第5张图片

你可能感兴趣的:(vue问题解决,less,前端,css,vue.js,typescript)