Vue.js ::v-deep、>>>、および Deep セレクターが機能しないのはなぜですか?

>> とディープ セレクターは機能しますか? " />

Vue.js ::v-deep、>>> およびディープ セレクターのトラブルシューティング

バックグラウンド

Vue.js ::v-deep のような深いセレクターを使用して、ネストされたコンポーネント内の要素をスタイル設定する方法を提供します。 >>> および :deep ただし、これらのセレクターを実装すると問題が発生します。

問題

::v-deep または > を使用しようとしています。 ;>> Vue コンポーネント内から子要素をターゲットにしても、スタイル ルールはそのまま渡されます。

解決策

Vue 2.0 - 2.6

Sass: ::v-deep を使用します

::v-deep .child-class {
  background-color: #000;
}

なしSass: >>>

>>> .child-class {
  background-color: #000;
}

コンポーネントの