小窝后台 (Vite)

当前网站的后台,采用 React + Vite 开发,独立完成了拖拽上传等组件,均采用 Hooks 模式编写

  • 项目类型:网站
  • 项目所属:个人
  • 担任角色:创建者
  • 技术栈:JSX、Less、React、TypeScript
  • 创建日期:2021-09-12
  • 维护情况:正常

该项目还承担了一定的试错过程,对一些新技术进行验证。

有哪些亮点

  • 编写了一些组件轮子,包括通知(Notice)、模态框(Modal)、抽屉(Drawer)等

    • 通知组件:在成功状态下可包含倒计时动画,动画结束后消失
    • 模态框和抽屉组件:点击“确认”时接受返回 Promise,成功后自动关闭
    • 拖拽排序组件:在批量上传媒体的时候可手动调整排序
    • 拖拽上传组件:将本地文件拖拽到指定位置,根据文件格式展示对应内容
    • 分页组件:根据总数量、每页数量和当前页数生成简短的页码
  • 实现了一个基于 textarea 的简易 Markdown 编辑器功能,但并不是“所见即所得(WYSIWYG)”的

    • 鼠标块选内容时会出现一个小浮动框,快捷操作设置文本样式

有哪些值得介绍的经历

  • 通过编写「通知」组件,了解到 React 组件 Key 的唯一性是比较重要的,会直接影响到状态变化后 DOM 的操作
  • 通过编写「批量上传媒体」功能,对 Promise 队列有一些了解,以及如何改善中途出错的处理
奇趣音乐盒技术源于 Kico Player
Emmm,这里是歌词君