Vue.js范围样式

Question

这是关于SFC范围样式的一个普遍问题，而不是一个问题。

假设我们有一个子组件，它只是输入元素的包装：

<template>
    <div>
       <input class="input" type="text" />
    </div>
</template>

<script>
  export default {}
</script>

<style scoped>
.input {
   width: 100%
   height: 40px;
}
</style>

在父组件中，我们有一个重复输入组件的形式：

<template>
    <div>
       <form>
         <div>
           <input-component />
         </div>
         <div>
           <input-component />
         </div>
       </form>
    </div>
</template>

<script>
  import InputComponent from './InputComponent.vue'

  export default {
     components: { InputComponent }
  }
</script>

由于Vue.js会自动为范围内的样式生成其他类名称，这是否意味着每次将组件与自己的类一起使用时，两个组件的样式都会重复？还是会重用相同的样式？