Wie formatiere ich untergeordnete Komponenten in Vue.js mithilfe von CSS-Selektoren?

Styling untergeordneter Komponenten in Vue.js mit /deep/, >>> oder ::v-deep

Im Kontext von Vue.js Mithilfe spezifischer CSS-Selektoren kann eine granulare Gestaltung untergeordneter Komponenten erreicht werden. Bei der Implementierung können jedoch Probleme auftreten.

Vue 2.0 - 2.6

Um untergeordnete Komponenten zu durchdringen und verschachtelte Elemente auszuwählen, können Sie entweder ::v- verwenden. tief (mit Sass) oder >>> (ohne Sass) in Ihren CSS-Regeln wie folgt:

Sass:

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

Anderes CSS:

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

Hinweis dass der