Vue 3 ::v-deep 作为组合器的用法已被弃用。改用 ::v-deep(<inner-selector>)

Posted 2023-02-22

【中文标题】Vue 3 ::v-deep 作为组合器的用法已被弃用。改用 ::v-deep(<inner-selector>)

【英文标题】：Vue 3 ::v-deep usage as a combinator has been deprecated. Use ::v-deep(<inner-selector>) instead

【发布时间】：2021-01-07 04:40:26

【问题描述】：

我在 Vue 3 中使用 ::v-deep 开始收到以下警告。

::v-deep usage as a combinator has been deprecated. Use ::v-deep(<inner-selector>) instead

CSS 如下所示：

.parent ::v-deep .child 
   ...

使用建议选项::v-deep(<inner-selector>) 的正确方法是什么？

【参考方案1】：

相关的 RFC 在这里：

https://github.com/vuejs/rfcs/blob/master/active-rfcs/0023-scoped-styles-changes.md

我认为您需要将其更改为：

.parent ::v-deep(.child) 

更新：

问题中提到的警告消息在 Vue 3 的更高版本中已更改为建议使用 :deep() 代替。这是::v-deep() 的别名，它已添加到此处的文档中：

https://v3.vuejs.org/api/sfc-style.html#deep-selectors

【参考方案2】：

小更新：现在，您需要将其更改为：

.parent :deep(.child)