博客作者分享了在使用Ant Design（Antd）进行前端开发时遇到的难点，包括Antd样式的自定义、文件上传的进度显示、下拉框组件的编写以及表单数据管理。解决方案涉及使用style标签和css-in-module调整样式，通过FormData处理文件上传，以及深入理解Antd文档以优化代码。作者还表达了学习Antd设计理念和源码的意向。
页面大概是下面这个样子
说说其中几个遇到的难点吧（东西不难，我太菜了）
- antd 样式和布局不好改，直接修改 style 属性代码会变得臭长；
- 文件上传，设为自定义上传后进度条没了；
- 活动图标下拉框的书写，比较绕；
- antd 自己维护表单数据，有时数据可能更新但不会触发页面重渲染
解决思路：
- antd 样式使用 style 标签修改，布局搭配 css-in-module 单独处理
- 这里文件上传只拿到一个 File 对象，最后提交的时候一块放到 FormData 中（不过还没和后端联调，后续未知）。因为直接获得 File 对象，进度条没就没吧，这种方案拿到进度条也是秒 100% 的…
- 下拉框大概长下面这样（样式好像出了点问题…）
**「选择模式」**选择上传的图标
「删除模式」 点击后出现确认删除气泡框
为什么说绕呢？因为我现在都表达不清楚，等整理好了再回头写吧🤨
- 第四条也暗示着我得熟悉熟悉人家的文档了，要不写出的代码又臭又长。
有时间学一学 Antd 的设计理念吧，顺便看一看他的源码。虽然自己也用 React + TS 写过几个小组件，不过很久不碰，谁又能保证不会忘呢？
扫一扫
2805
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
