【ant-design-vue】a-input、a-number、a-date在disabled时样式修改

最新推荐文章于 2023-07-14 08:56:44 发布

Chx.zhang

最新推荐文章于 2023-07-14 08:56:44 发布

阅读量2.8k

点赞数 2

文章标签： vue.js 前端 ant-design

本文链接：https://blog.csdn.net/qq_38987146/article/details/121934112

版权

本文记录了对ant-design-vue中a-input、a-number、a-date组件在disabled状态下颜色过深的问题进行的样式覆盖，以提高可读性。同时提出了疑问，为何之前项目未选用readOnly属性，而是在禁用状态下进行样式调整。这引发了一场关于技术选择与用户体验的思考。

摘要由CSDN通过智能技术生成

a-input、a-number、a-date在disabled时，颜色比较深，不宜查看。由于之前项目之前在对输入框禁用，不宜查看，故做此修改并记录。
只是有一个疑问，为什么之气那项目的查看不用 readOnly？？？不香吗？？？？？

/*覆盖ant-design-vue 样式**/
.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector,
.ant-input-disabled,
.ant-input-number-disabled {
    color: rgba(0, 0, 0, 0.65) !important;
    background: #fcfcfc !important;
    cursor: not-allowed !important;
}