vue2版本elementUI的clearable属性和DateTimePicker 下拉框的清空功能冲突
1. 问题
在使用DateTimePicker 日期时间选择器控件时，有些场景下需要设置数据不可清理，按照常规操作直接设置属性 clearable 的值为false即可，但是发现下拉框中仍有按钮“清空”，这就跟我们的业务需求冲突了。
2. 思考
纵观element UI相关文档以及 Attributes参数，我们没有找到其它字段或者方法设置隐藏该“清空”按钮。另外看到一个有意思的现象，即疑似官方在某个地方也遇到这个缺陷了哈哈。
想来想去，这里按钮也并不是很多，而且时间控件也提供了popper-class给下拉面板设置样式，也许我们就可以利用起来。
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| popper-class | DateTimePicker 下拉框的类名 | string | — | — |
3. 解决方案
-
- 我们在控件上设置 popper-class, 比如值为
hide-clearall。
- 我们在控件上设置 popper-class, 比如值为
-
- 在全局样式中设置隐藏“清空”按钮的样式，注意不要影响到其它按钮样式。
.hide-clearall .el-picker-panel__footer .el-button--text{
display: none;
}
注意：设置该样式一定不能影响其它按钮样式！！！