vue scoped父组件影响子组件样式

此处坑记录为自己查看 坑描述：vue父组件使用scoped 子组件也使用scoped时，当父组件使用一个类和子组件最顶层使用同一个类时，父组件的样式会影响子组件样式

父组件代码

<div class="create-flowline color">
    <step-template >
    </step-template>
    <div class="color">作用域</div>
  </div>

子组件代码

<div class="step">
    <div class="color">子级颜色</div>
  </div>

渲染机制

// 父类渲染
<div data-v-5cd35042="" class="color">作用域</div>
<style lang='stylus' scoped>
.color
  color red
</style>
// 子类渲染
<div data-v-daeaa5ea data-v-5cd35042 class="color">子级颜色</div>