Scoped原理
Scoped是Vue中的一种样式隔离机制，主要用于防止组件样式污染。其核心原理如下：
编译转换：Vue在编译带有scoped的样式时，会给组件模板中的每个元素添加一个唯一的属性（如
data-v-xxxxx），同时将CSS选择器修改为带有这个属性的选择器。属性选择器：样式规则会被转换为属性选择器，例如
.container会变成.container[data-v-xxxxx]，确保样式只作用于带有该属性的元素。样式隔离：通过这种方式，组件样式只会应用于当前组件内的元素，不会影响到其他组件或全局样式。
深度作用选择器：当需要影响子组件样式时，可以使用
>>>、/deep/或::v-deep操作符来穿透scoped的限制。局限性：scoped无法完全避免样式冲突，特别是在使用第三方组件库时，因为第三方组件的元素可能没有添加scoped属性。
这种机制简单有效，是Vue组件化开发中样式管理的重要特性。