Vue

VUE3之Component(一)

组件的css作用域问题

style标签下的scoped属性表明当前的css样式只对本文件生效:

<style scoped>
    h2{
        color: red;
    }
</style>

但是VUE3会给div标签加上data-v的属性,这个属性会传给使用的局部组件的根节点:

image 17

因此如果每一个组件的template不加上一个div作为根节点的话,父组件的css也会作用到子组件上。

发表评论