从真实页面的测量与复现出发，优化请求竞态、状态同步、列表渲染、包体积和表单反馈，并验证接口幂等边界、代码规范及关键业务交互。适用于保留现有技术栈的 Vue 存量工程。
## 任务目标 请完成选定 Vue 页面或模块的性能、状态一致性与交付质量优化，先测量问题，再落地代码并验证。指标未给出时先记录基线并提出与场景相符的目标，不虚构响应时间、提升比例或用户规模。 在现有授权范围内完成实际改动和验证；缺少外部条件时先完成可独立实现的部分，不能只停留在计划。 ## 输入信息（选填） 两项均可留空，也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表；能读取的内容由执行者补齐。 优化对象或现象：优先定位对话中提到的慢操作或状态错乱；未描述现象时，从当前页面的首屏、筛选、分页和编辑切换建立基线，先处理可复现的状态错误和重复请求。 工程或复现资料：使用已确认工程的路由、组件、请求封装、store、测试数据和现有性能记录；可运行时自行采集网络、渲染和构建产物证据。 ## 信息不完整时 先使用本次对话中已经说明的信息；用户留空、写“暂无／不清楚”或未替换输入标记，都按缺失处理，不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问，不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料，不为补齐输入擅自扩大操作范围。 ### 优先确认 - 核实 Vue 2/3、JS/TS、请求库、UI 库、路由缓存及现有 watcher 清理方式，不要求用户手填版本。 - 沿筛选、翻页和切换记录检查状态写入、请求取消、旧响应及 finally 的生效条件。 - 记录代表性操作的数据规模、模式、缓存、设备和网络条件，分开测量接口等待、重复请求、计算与组件更新。 - 检查模板循环、字典查找、资源导入、路由拆包和真实产物，确定优化影响范围。 ### 可采用的默认处理 - 未给性能指标时先采集可复查基线，以消除已证实浪费且业务不回归为目标，不承诺任意提速比例。 - 优先局部状态、纯 computed 与必要副作用清理；未证实瓶颈前不引入虚拟列表、全局缓存或 memo。 - 保留当前分页、选择及字典语义，写请求超时显示结果待确认，不把取消请求当作撤销业务。 ### 必须有依据的事项 - 优化涉及跨页选中、缓存失效或租户切换，而代码与接口无法确定需要保留的业务状态。 - 写操作结果未知且接口没有查单、幂等或补偿依据，不能自行重试并宣称提交成功。 只有缺口会改变业务结果、权限边界或关键实现，且无法从现有资料确认时，才集中提出最多 3 个关键问题；说明影响，并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定，不逐项等待确认。 ### 资料仍不足时的交付 - 无法运行页面时交付按代码证据排序的瓶颈候选、状态写入图和最小修正，另给同条件测量步骤。 - 没有代码时给出筛选竞态、重复提交、页面恢复的复现与验收用例，不填造耗时或包体数据。 ## 执行要求 关注用户操作结果和可复查证据，不为了使用优化技巧改动系统架构。 ### 读取工程并建立可比基线 确认目标目录、分支和 dirty 改动，保留原有内容，只改选定范围。核实 Vue 2/3、JS/TS、API 风格、构建框架、UI 库、store、路由、请求库和锁文件，保留选型，不默认升级或迁移。复现首屏、筛选、翻页、弹窗、切换记录等实际问题；记录数据规模、生产构建或开发模式、缓存状态、设备及网络。结合浏览器性能、网络、Vue DevTools 和构建分析，区分接口等待、重复请求、脚本计算、组件更新和资源加载；权限或数据错误优先于微小速度收益。 ### 定位结构与状态责任 页面编排流程，业务组件承接领域交互，通用组件负责稳定通用契约，composables/hooks 管理组合式逻辑和清理，API 层统一请求契约，store 管理必要共享状态，types 与 styles 各归其位；按问题整理现有模块，不建空目录。纯无副作用函数进入 util，领域规则集中在业务模块，真正共用的响应式能力才复用。不要把数据、权限、表单和所有展示塞进万能组件或 util，也不为性能把所有状态搬入全局。 ### 消除状态不同步 为查询条件、分页、选择项、表单和缓存分别确定唯一写入来源，派生值用 computed，props、事件载荷和 v-model 契约明确，不直接修改父级状态。检查路由返回、筛选重置、切换租户或记录、删除末页数据后的状态；分页和选择项的保留规则必须对应业务。编辑副本说明与源数据同步时机，避免双向 watch 相互回写。枚举和魔法值与服务端数据库码、权限及字典一致，已有字典继续复用，禁止复制另一套状态映射；失效缓存不得让旧权限或旧字典继续控制操作。未知或停用字典码保留原始值并作可识别提示，禁止映射为成功、首项或任意合法状态；编辑提交按真实接口契约处理，不为消除告警擅自改写原值。 ### 处理请求竞态和副作用 快速输入、连续翻页、切换弹窗记录会形成并发请求。按当前请求库取消可取消的旧请求，同时用序号或请求条件快照保护结果、错误和 finally，确保过期请求不能覆盖当前内容或解除新请求的 loading；不同业务请求分别维护状态。取消客户端请求不代表服务端业务已撤销，写操作超时不能直接自动重试。watch 只监听必要源，避免无边界 deep 和回写循环；清理失效请求、监听、定时器与订阅。Vue 3.5+ 的 onWatcherCleanup 必须同步注册，低版本使用其支持的清理机制和生命周期；离开、卸载及缓存页面停用时按实际行为处理。 ### 控制计算与渲染成本 v-for 采用稳定唯一的业务 key，排序和编辑列表不用索引、随机值或时间戳。将模板和循环中昂贵过滤、排序、格式化、字典查找移到有明确依赖的派生层；computed 保持纯计算，不夹带请求或状态修改。对重复查找按数据规模建立合适索引，注意索引随源数据更新。避免每项都发请求；优先真实可用的批量查询或服务端分页，没有接口时说明限制并控制并发，不伪造后端能力。检查 props 是否反复创建无意义新对象、组件是否无关更新；按证据减少渲染，不盲目 memo、深比较、shallow API 或缓存，防止失去必要更新。 ### 按场景优化列表与资源 根据实测 DOM 数量、交互延迟和数据规模选择分页或虚拟列表，核验行高、滚动定位、选择项、键盘操作与 UI 库能力，不用固定条数一刀切。测量实际生产包、关键路由资源和重复依赖，按既有构建能力优化导入、路由懒加载及重资源加载时机；确保首个操作不会因拆包失败失效。移除代码或依赖前核查自动导入、动态路由、按需组件与注册入口。缓存明确键、有效期、失效条件及身份边界，不用长期全局缓存掩盖接口问题。任何优化都要有前后相同场景的记录，不能以依赖宣传体积代替实际产物。 ### 完成可用的业务反馈 区分 loading、empty、error、成功及权限不足，失败不可显示成空数据，保留数据或清空数据按场景说明。正确区分 null、未提供、0、false 和空字符串。表单按输入、失焦与提交时机校验，错误就近展示并可纠正；服务端失败保留合理输入，弹窗关闭、重新打开不残留旧结果。提交时即时反馈并防重复点击，后端幂等键、唯一约束和事务仍由接口承担；没有后端能力时写明局限，不能把防抖当幂等。失败后给出真实可行的恢复路径，不吞错、不伪造成功。 ### 把优化纳入既有规范 保持政企中文界面的层级、对齐、间距、表格密度、主次操作和反馈一致，不添加非业务口号与技术说明。命名清楚，注释解释业务原因、接口限制和性能取舍，不逐行注释。使用兼容版本的 ESLint、eslint-plugin-vue，TS 工程配套 typescript-eslint，并保留 .vue 与脚本解析器分工；沿用 flat/legacy 模式和现有 ESLint 或 Prettier 格式方案。统一空格、缩进、换行、引号、分号、导入及文件区块顺序，对齐 .editorconfig；兼容配置只解决格式职责冲突，不降低质量门槛。零新增 lint 违规，不用 disable、扩大 ignore、any 或 ts-ignore 隐藏问题，不整仓格式化制造无关差异。 ## 交付与验收 ### 验证结果并完成交付 实际执行相关 lint、适用的 typecheck、生产 build 和关键交互验收；JS 工程无类型检查时说明不适用，工具或环境缺失则标记未执行。至少覆盖正常与空数据、未知与停用字典码、接口失败与恢复、快速筛选翻页、旧响应晚到、连续提交、切换记录、返回页面和权限变化；验证表单失焦、弹窗焦点、中文换行及新产生的控制台错误。只在隔离且获准的测试环境模拟网络故障，不影响真实业务。性能比较保持设备、数据、模式及缓存条件一致，多次记录波动，分别列包体积、请求量、渲染或交互指标；改善不能以业务回归为代价，未改善也如实报告。 输出：①问题、复现及基线；②已实现改动与关键路径，说明结构、状态和请求规则；③实际生效的检查与格式配置；④优化前后指标和测量条件；⑤验收项目、命令或操作、结果及未执行原因；⑥剩余限制和最小后续工作。保留历史失败与新增问题的区分，未跑不宣称通过，没有测量不宣称提速。完成已授权实现，不只提交建议，不生成无关 Markdown 文档。 ### 本条完成检查 - 记录问题、基线、实际修改和相同条件下的优化前后指标，未改善或未测量如实列明。 - 验收旧响应晚到、finally 竞态、快速分页、记录切换、权限变化及未知字典码，不以性能收益抵消业务错误。 - 执行相关 lint、适用类型检查、生产构建与关键交互，列出真实命令、结果和剩余限制。 按本条要求组织结果，使用简洁中文和一致的编号、术语、缩进及空行；已有项目格式优先。只说明实际完成的内容，将采用的假设、未完成项和缺少的条件写在相关位置，不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注，不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方依据：Vue 性能：https://vuejs.org/guide/best-practices/performance.html、Vue 监听清理：https://vuejs.org/guide/essentials/watchers.html、阿里前端规约：https://github.com/alibaba/f2e-spec、Vue 插件配置：https://eslint.vuejs.org/user-guide/、Prettier 与 Linter：https://prettier.io/docs/integrating-with-linters。 收录核验（2026-09-08）：已核对公开资料和本次项目要求的覆盖范围；尚未使用真实项目执行本模板或进行模型效果评测。具体改动、性能和回归结果须在目标工程中验证。
处理 TDesign Dialog 表单弹窗、删除确认等场景中的重复提交、关闭来源、草稿保留和失败恢复。
## 任务目标 请核查当前 Vue 业务弹窗的保存、关闭与异常恢复，使用户能明确完成操作并在失败后继续处理。 以核查和评审为主，给出有证据的判断及可复核的修改建议；本次用户另有明确实现要求时，按其授权范围执行。 ## 输入信息（选填） 两项均可留空，也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表；能读取的内容由执行者补齐。 弹窗业务目标：沿当前页面使用的目标弹窗追踪打开、输入、确认和关闭；未描述缺陷时重点检查提交未完成即关闭、失败无法恢复及切换记录残留。 弹窗或接口资料：读取弹窗与父页面、表单、保存接口、状态管理和已安装 TDesign Dialog 类型，从现有逻辑提取草稿及成功后刷新规则。 ## 信息不完整时 先使用本次对话中已经说明的信息；用户留空、写“暂无／不清楚”或未替换输入标记，都按缺失处理，不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问，不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料，不为补齐输入擅自扩大操作范围。 ### 优先确认 - 确认弹窗唯一任务、对象、visible 所有者和真实请求周期。 - 核对取消、关闭按钮、遮罩和 Escape 的实现及当前版本是否支持异步拦截。 - 检查回车与表单提交重复触发、编辑回填、销毁重建、旧响应和成功后的页面刷新。 ### 可采用的默认处理 - 默认核查并给状态表和必要修正；明确修复要求时在现有组件能力内实现，不额外建立弹窗框架。 - 保存失败保留合理输入并恢复操作，服务端结果未明确前不展示成功或自动关闭。 - 沿用已有草稿和关闭约定，前端提交锁仅防重复触发，不当作后端幂等保证。 ### 必须有依据的事项 - 未保存草稿是否允许丢弃、提交中是否允许关闭缺少业务约定，且实现必须改变当前数据保留行为。 - 接口可能已受理但无返回，缺少幂等或结果查询依据时不能自行再次写入。 只有缺口会改变业务结果、权限边界或关键实现，且无法从现有资料确认时，才集中提出最多 3 个关键问题；说明影响，并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定，不逐项等待确认。 ### 资料仍不足时的交付 - 缺源码时交付显示和请求状态、各关闭来源处理及失败恢复方案，组件 API 明确待按版本核对。 - 后端不可用时用隔离的成功、校验失败、延迟和未知结果验证前端处理，真实联调单列。 ## 执行要求 按当前版本的 TDesign Dialog 能力处理显示、加载和关闭事件。业务操作的幂等、授权以及是否允许取消，需要依照项目事实实现。 1. 列出弹窗承担的唯一主要任务、操作对象和完成条件。区分确认删除、编辑保存、结果提示等场景，按钮直接写业务动作；需要说明影响范围时描述真实后果，不使用笼统的“温馨提示”掩盖关键内容。 2. 设计未操作、输入中、提交中、成功、失败等状态，确定谁控制 visible。把确认按钮加载与真实请求周期绑定，避免请求尚未结束弹窗就关闭，或请求失败后按钮一直处于不可用状态。 3. 分别处理取消按钮、关闭按钮、遮罩点击和 Escape。存在未保存修改时按业务约定保留、确认放弃或阻止关闭；不要把返回 void 的动画前回调误当成支持异步拦截的关闭守卫，应检查该版本真实接口能力。 4. 核对回车确认与内部表单提交是否可能同时触发请求。对连续点击、键盘触发和慢请求期间再次操作进行限制；前端限制只减少重复触发，涉及不可重复业务操作时同时核查服务端约定。 5. 明确关闭时是否销毁子内容以及重新打开时如何初始化。编辑另一条记录时清理旧对象、错误提示与异步回调，成功后根据接口实际结果刷新列表或详情；不得把本地假定值直接当成服务器保存结果。 6. 验收焦点进入与返回、键盘操作、长内容滚动、遮罩遮挡和中文按钮长度。模拟业务校验失败、网络中断、延迟响应、重复触发及用户切换记录，检查能否继续编辑或安全返回原页面。 ## 交付与验收 输出：弹窗状态表、每种关闭来源的处理、必要代码修改和验收记录。对接口已受理但客户端未收到结果的情况单独说明确认结果的办法，避免直接再次提交。缺少版本或源码时先给处理方案和待核实 API，不声称组件天然保证全部业务安全。 ### 本条完成检查 - 给出状态表、关闭来源与草稿处理，确认异步守卫采用实际 API 而非动画回调。 - 验证点击与回车重复、失败保留输入、切换记录、旧响应和成功后真实数据刷新。 - 检查焦点进入返回、键盘、长内容滚动及遮挡，分别记录已执行与待联调行为。 按本条要求组织结果，使用简洁中文和一致的编号、术语、缩进及空行；已有项目格式优先。只说明实际完成的内容，将采用的假设、未完成项和缺少的条件写在相关位置，不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注，不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源（2026-09-08 核验）： - [腾讯 TDesign《TDesign Vue Next Dialog 类型与接口说明》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/dialog/type.ts)
