通过在style 上加scope可以避免影响其它组件
修改app.vue 、helloworld.vue style 代码如下
1、都不加scope
<style>
div {
color:green
}
</style>
<style>
div{
color:red
}
</style>
使用的子组件样式
2、子组件加scope
<style>
div {
color:green
}
</style>
<style scoped>
div{
color:red
}
</style>
加scoped不影响父组件
3、父组件加scope
<style scoped>
div {
color:green
}
</style>
<style>
div{
color:red
}
</style>
加scoped不影响子组件
4、如果想让父组件影响加了scoped的子组件可以这样写
<style scoped>
div>>>div {
color:green
}
</style>