父组件:TodoList.vue
子组件:TodoItem.vue
1、样式实际问题主要体现在:当父子组件样式名相同时,如class=“item”,为了让子组件中写的样式不影响父组件,用到:scoped;
设置局部样式:
子组件:
<style scoped>
.item{
color:red;
}
</style>
2、如果子组件不使用scoped,则此样式为全局样式,当父组件第一次使用子组件后,便开始使用此样式;
子组件:
<style>
.item{
color:red;
}
</style>
即: