架构设计:采用注册表模式解耦组件与框架,新增简历模块不改画布代码;设计配置驱动的动态表单引擎,通过DynamicForm遍历propDefs自动生成属性面板,支持Input / TextArea / Upload / DynamicList四种控件类型。
2. 交互实现:基于@dnd-kit实现组件从面板到画布拖拽及画布内排序;通过物理分离拖拽手柄与点击区域解决拖拽与选中的交互冲突。
3. 动态列表编辑:封装通用DynamicListEditor组件,支持添加/删除行,被技能栈、实习经历、项目经历三个模块复用。
4. 导出PDF:使用html2canvas截图+jsPDF生成A4尺寸PDF,内容超一页自动分页;处理头像上传裁剪与导出清晰度问题。
5. 工程化:pnpm monorepo管理multi-package项目;Git + Gitee版本控制;腾讯云CloudBase部署上线。
架构设计:采用注册表模式解耦组件与框架,新增简历模块不改画布代码;设计配置驱动的动态表单引擎,通过DynamicForm遍历propDefs自动生成属性面板,支持Input / TextArea / Upload / DynamicList四种控件类型。
2. 交互实现:基于@dnd-kit实现组件从面板到画布拖拽及画布内排序;通过物理分离拖拽手柄与点击区域解决拖拽与选中的交互冲突。
3. 动态列表编辑:封装通用DynamicListEditor组件,支持添加/删除行,被技能栈、实习经历、项目经历三个模块复用。
4. 导出PDF:使用html2canvas截图+jsPDF生成A4尺寸PDF,内容超一页自动分页;处理头像上传裁剪与导出清晰度问题。
5. 工程化:pnpm monorepo管理multi-package项目;Git + Gitee版本控制;腾讯云CloudBase部署上线。