⭐️ Material UI 也遇到了覆盖样式的问题了

2021-06-04

今天的工作任务也在继续完善着 FBApp 项目,改善了路由拦截、侧边栏以及其他界面内容,拆开了组件逻辑,也成功接入了调用店内商品的接口。

基本上没遇到什么大问题,就是发现 Material UI 也有 Bootstrap 时代样式覆盖的问题,一个 CardContent 组件的内间距默认有一条 paddingBottom,你直接覆盖是不起作用的,因为这条属性的 CSS 选择器包含 :last-child,优先级比覆盖样式的高。按照往常思路,这种问题就只能上 !important 了么?虽然说用 !important 也仅仅是影响使用了该覆盖样式类名的组件,不会影响到页面其他相同 CardContent 组件的效果,但还是感觉很不优雅,覆盖样式果然还是写 CSS 最坑的地方啊!

你可能会说,覆盖这么麻烦,那为啥不用 Tailwind 啊?说的很好,Tailwind 只是一个 CSS 的缩写,相当于自己写样式。为了实现一个组件,交互,数据处理和传参还是得自己写,完全就没有提升开发效率。Antd 确实很方便,但是样式覆盖可比 Material 还要难啊!不用 Styled Components 叠一层组件的话,!important 还会更多!还是很不优雅!所以请教各位大神,还有什么更好的办法了么?

晚上更新了下小窝后端,根据我想到的「新规范」重构一部分控制器,主要有日志、闲杂、页面和用户。并在 Footer 加入了「时间轴」的链接,方便进入查阅!

花园
上任弼马温 大雨 郁闷
概览页 时间轴
奇趣音乐盒 技术源于 Kico Player
Emmm,这里是歌词君