两套主题下，如何修改element中插入body下的元素样式

Question

在一个子组件内部用到el-select,然后这个子组件需要在不同的地方引用不同的主题，通过在父组件加不同的class,从而使子组件应用不同的主题，element的其他组件可以，但插入到body下的那些组件不行。

比如：

<parent class="dark|light">
    <child>
        <el-select></el-select>
    </child>
</parent>

//全局外部css
.dark{
    .el-select-class{
    
    }
}
.light{
     .el-select-class{
    
    }
}

希望通过父组件应用不同的class（dark或light)，el-select显示不同的color

Answer 1

在 /plugins/element.less 中修改样式级别更高一点

在 element.js 或 main.js 中直接引用
import './element.less'

Answer 2

<style lang="" scoped></style>
你是否在style增加了scoped属性，这个是私有的，不能修改组件或子组件的样式。需要去掉
<style lang=""></style>

Answer 3

select 可以设置popper-class啊