应优先使用加载状态和微提示替代弹窗：主动取消时按钮变灰+文案切换+轻微淡出动画，自动取消则完全不提示；catch中识别取消错误并跳过赋值；长任务取消后显示2秒底部横幅。
直接在界面上给出明确、轻量、不打断操作的反馈，比弹窗或全局提示更合适。用户需要知道“刚才的操作没白等”，但不需要被额外信息干扰。
用加载状态和文字微提示替代弹窗
多数场景下，用户点击“取消”或触发自动取消（比如快速输入搜索），页面本身已有加载态。此时只需更新按钮文案或加一行小字说明：
- 按钮从“加载中…”变成“已取消”或“重新获取”
- 在数据区域下方显示一行灰色小字：“请求已取消，可重新操作”
- 不出现 Alert、ElMessage 或 Toast —— 这类提示容易重复触发、遮挡内容，且与“取消”这个轻量动作不匹配
区分主动取消和自动取消的反馈强度
用户手动点“取消按钮”时，反馈可以稍明显；而因新请求覆盖旧请求导致的自动取消，通常无需单独提示。
vue-composition-api-best-practices
下载
Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。
- 主动取消：按钮变灰 + 文案切换 + 可选轻微淡出动画（如 loading 区域 opacity 从 1 → 0.6）
- 自动取消（如搜索框防抖中旧请求被覆盖）：完全不提示，只保证最新请求结果正确渲染即可
- 若用户连续多次取消，可记录次数，第三次后才加一句“已为您暂停请求，稍后再试”
错误区域不展示取消相关报错
catch 块里识别到 axios.isCancel(err) 或 err.name === 'CanceledError'，就跳过 error.value 赋值，避免把“请求被取消”当成错误显示给用户。
立即学习“前端免费学习笔记（深入）”；
- 不要写：
error.value = '请求被取消' - 应该写：
if (!axios.isCancel(err)) error.value = err.message - 这样错误提示区保持空白或维持上一次真实错误，界面更可信
特殊场景：长任务取消后补充轻量确认
针对导出报表、生成PDF等耗时超过3秒的操作，用户主动点击取消后，可加一个2秒内自动消失的底部横幅：
- 文案：“已停止生成，未完成的数据不会提交”
- 样式：浅灰底 + 深灰字 + 右侧带 × 图标（点击可立即关闭）
- 不阻塞后续任何操作，也不要求用户点击确认
