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

Question

我开始在 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>) 的正确方法是什么？

原文由 Manoj Shrestha 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 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

原文由 skirtle 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

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

 .parent :deep(.child) {

原文由 eightball 发布，翻译遵循 CC BY-SA 4.0 许可协议