javascript – Wie man im komponentenbasierten Entwicklungsmodell von vue.js dafür sorgt, dass der Stil nur auf diese Komponente und ihre Unterkomponenten angewendet wird.

Question

Wenn ein Gültigkeitsbereich verwendet wird, kann sich der Stil nur auf die aktuelle Komponente auswirken, nicht jedoch auf deren Unterkomponenten. Manchmal gibt es aufgrund von Designproblemen viele gemeinsame Stile zwischen verschiedenen Unterkomponenten. Ich würde gerne einen Master fragen, ob der Stil dies kann nur auf diese Komponente und andere Unterkomponenten angewendet werden.

漂亮男人 · Answer

不使用scoped并自己把控制握好css命名空间

可以对每个组件都用特定唯一的class命名，且该组件的css都在该命名的范围内。

例如 header是index的子组件

    .header-comp{
        h2{
            
        }
        .title{
        
        }
    }

    .index-view{
        .container{
        
        }
    }

最终渲染

    .index-view{}
    .index-view xxx{}
    .header-comp{}
    .hader-comp .xxxx{}