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

Question

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

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

CSS 如下所示：

.parent ::v-deep .child {
   ...
}

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

Answer 1

相关的 RFC 在这里：

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

.parent ::v-deep(.child) {

更新：

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

Answer 2

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

.parent :deep(.child) {

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