/deep/在vue 3.0会报错

最新推荐文章于 2025-09-21 21:40:09 发布

转载最新推荐文章于 2025-09-21 21:40:09 发布 · 2.8k 阅读

5 ·

CC 4.0 BY-SA版权

原文链接：https://blog.youkuaiyun.com/weixin_40679578/article/details/106401517

VUE 同时被 2 个专栏收录

117 篇文章

订阅专栏

CSS样式

25 篇文章

订阅专栏

本文介绍如何使用::v-deep选择器来修改Vuetify框架中的组件样式，通过具体代码示例展示如何调整v-text-field组件的边距和内边距。

可以用`::v-deep`来解决

使用方法如下

::v-deep .v-text-field.v-text-field--enclosed .v-text-field__details {
  margin-bottom: 8px;
  padding: 0px !important; 
}

在想要修改的样式前面加上v-deep就可了

转载原文链接：https://blog.youkuaiyun.com/weixin_40679578/article/details/106401517

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

zlting~

关注关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Vue3样式穿透deep

qq_37635012的博客

06-28

1457

在vue3.0之前可使用，例如(复写样式前加/deep/)，vue3.0及后使用就会报错。

VUE_vue使用/deep/报错并且无法启动项目完美解决，/deep/编辑器标红解决

小歪博客

09-04

1万+

/deep/深度选择器在使用的时候会出现编辑器报错，标红的报错，但是样式任然会起作用！解决办法：只需要在/deep/前面加一层标签就不会报错了因为一般外层都是div标签，我这里就直接加的div标签完美解决！注意： style标签加上 scoped <style scoped> ...

1 条评论您还未登录，请先登录后发表或查看评论

vue3中使用deep语法报错

weixin_43404937的博客

01-12

3534

vue3中使用deep语法报错，stylelint, prettier, eslint规范

vue项目使用deep语法报错并且无法启动项目最佳最完美解决方案

m0_67401055的博客

03-09

1万+

vue项目使用/deep/语法报错最近使用vue创建后台管理系统，在改变饿了么组件样式时，使用/deep/样式穿透压根不生效，而且终端还会报错，之前可是可以随便用/deep/的，一下子就给整懵逼了~，先来看看报错信息长啥样：然后当你去各种百度会发现遇到同样问题的人还挺多，而且绝大多数出现的时间都是在2020年期间开始很多人出现这类问题：然后最多的答案无非就是使用::v-/deep/ 来替换/deep/，确实有效，但是会不能使用scss嵌套写法的问题，不然样式嵌套的子元素样式不会生效如图：所以只能

Vue 深度选择器（:deep）完全指北：从“能用”到“用好”

最新发布

weixin_48221903的博客

09-21

1097

你在 <style scoped> 里写过 .a >>> .b、 /deep/ .b 或者 ::v-deep .b ？

vue-cli3.0深度选择器/deep/报错

qq_40291247的博客

05-18

3052

::v-deep尝试一下 ::v-deep .el-button{ background: rebeccapurple; }

vue3使用::v-deep深度选择器不生效

DN金猿的博客

08-04

2268

会出现 ::v-deep usage as a combinator has been deprecated. Use :deep() instead of ::v-deep .的报错。：：v-depth用作组合子已被弃用。使用：deep（＜内部选择器＞）而不是：：v-deep＜内部选择器>。需要改成:deep(class),示例代码如下。

vue3.0学习笔记（watch监听特性）

m0_58849641的博客

07-08

520

注意: deep:true是深度监听开启后能够复杂的结构对象或数组 immediate:true是一开始就监听 wacthEffect默认immediate:true 在wacthEffect里谁用到了就会监听谁computed注重计算出来的结果(回调函数的返回值),所以必须要写返回值wacthEffect更注重过程(回调函数的函数体),所以返回值不是必须的...

Vue3.0云里雾里

weixin_55493330的博客

03-27

1851

/基本类型的响应式数据let name = ref('张三')//对象类型的响应式数据hobbyname: '章子怡',age: 45,sex: '男'})ref可以定义基本类型的响应式数据，也可以定义对象类型的响应式数据ref的底层还是reactive区别：1.ref创建的变量必须使用.value可以使用volar自动添加.value2.reactive重新定义一个对象hobby的时候，这个对象就失去了响应式属性。

为什么必须使用::v-deep 使用/deep/ 报错运行报错

03-14

但是随着 Vue 版本的发展，尤其是 Vue 3.0 发布后，官方逐渐淘汰了旧式的写法（如 `/deep/`, `>>>`, 和 `::v-deep`），并推荐统一采用新的语法 `:deep()`[^1]。 #### 原因分析 - **兼容性和标准化需求**：虽然 `/...

【VUE3】uniapp + vite中 uni.scss 使用 /deep/ 不生效（踩坑记录三）

weixin_44216637的博客

06-28

1124

uniapp + vite中 uni.scss 使用 /deep/ 不生效

关于在vue3项目中使用/deep/和::v-deep控制台报警告的问题记录--【vue3中用:deep()代替】

wangshuo0520ai的博客

07-15

3238

关于在vue3项目中使用/deep/和::v-deep控制台报警告的问题记录--【vue3中用:deep()代替】

vue 深度选择器/deep/报错（标红）

自律遇到更好的自己！！

07-20

817

在vue进行页面开发过程中，为了更改组件原本的样式，写出这样的代码，会出现爆红的情况的情况：大多数的要修改元素都是在标签下的，换一下的下的写法，完美解决：

vue3中 /deep/ 的使用，vue3不支持/deep/样式

前端打工人的博客

02-06

2094

vue2中是使用/deep/样式穿透，在vue3中不支持了，vu3中使用:deep()取代了。

VUE3 :deep() 无效

YONGEGE

10-11

1842

vite 4.2.1 以上新版本官方支持不带父级标签也可以生效。1.1 升级vite版本到4.2.1以上（推荐）下不使用一个标签来包裹全部内容，而此时。父级元素标签，所以样式穿透也就无效了.的时候，在 html 的标签中会生成。使用:deep() 添加样式无效。就是利用的这个属性生成的css；而在 vue3 中，我们可以在。在第一层的情况下就没有对应的。解决方案（任选其一）场景复现（无父标签）

vue3使用less,scoped后发现:deep不生效

/deep/在vue 3.0会报错

可以用::v-deep来解决

可以用`::v-deep`来解决