前言
最近在工作中用到了element-ui的el-date-picker日期时间选择器。修改样式的时候，属实花了一些时间。因为el-date-picker是挂在body下的，使用/deep/改不掉。
所以把我用过的两个解决方案总结出来分享给大家。如果大家有更好的解决方案欢迎在评论区留言，谢谢！
方案1：popper-class
使用时间日期选择器的popper-class属性，给其设置样式。
这个属性是官方给出的，细心的同学尝试一下，就可以解决修改el-date-picker样式的问题了。
如图，我们就成功给时间日期选择器添加了一个className，设置其样式的时候注意一下css层级关系即可。
示例代码：
<el-date-picker
v-model="valueTime"
type="datetime"
placeholder="选择日期时间"
popper-class="date-picker">
</el-date-picker>
方案2：修改全局的样式
修改全局的样式虽然不是很好，但一般风格统一的系统，大概率不会给时间日期选择器设置多套样式。
所以既然所有的时间日期选择器样式都一样，那在全局统一设置也未尝不可。
注意：虽然vue支持同一个组件存在多个
<style>标签，但是像这种影响全局的还有不要放在单个组件下了，最好还是单独放在一个文件引入比较好，不然万一后期要维护可就得骂娘了。
结语
本文到此结束
如果大家还有什么其他想法，欢迎在评论区交流！
