为什么vue中的父组件加上了scoped后还会影响子组件中的样式

原因

当父组件中的子元素跟子组件的根元素同为兄弟结点时，在父组件中定义的class（具有相同的类名的元素）会影响到子组件的根元素的样式， vue官方文档。

解决办法

原理是避免父组件中的class与子组件的根元素的class重名，或者更改当前的层级，避免跟同名的class在同一及。
相关文章------scoped的作用。