vue2修改组件样式

要在 Vue 2 中修改子组件的样式，当父组件套用了当前组件的 class 但在子组件中没有生效时，可以通过以下几种方式来实现样式修改：

1. 使用 ::v-deep 深度选择器

Vue 提供了 ::v-deep 深度选择器，可以穿透组件的作用域，直接修改子组件的样式。

示例代码如下：

父组件 (ParentComponent.vue):

<template>
  <div class="parent">
    <ChildComponent class="special-class" />
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  name: 'ParentComponent',
  components: {
    ChildComponent
  }
}
</script>

<style scoped>
.special-class ::v-deep .child {
  color: red; /* 修改子组件样式 */
}
</style>