Agent Skills
返回列表
跟进结果轻提示

跟进结果轻提示

开发编程 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md,安装 @user_f1b049da/lf2026712

技能介绍

要解决的问题

跟进操作后缺少即时反馈是常见的体验缺口。用户提交跟进记录后,界面毫无变化,会误以为操作未生效;如果每个组件都自行 new Notyf(),又会出现多个 toast 堆叠、样式错乱、无法自动关闭的问题。更糟糕的是,用 Toast 替代删除确认等高风险操作,会让用户在不经意间误触不可逆操作。

核心能力与实现

本技能基于 Notyf 库,提供一套全局单例的轻量反馈方案。核心思路是应用内只创建一个 Notyf 实例,通过两个方法复用:toastFollowOk 展示成功提示(绿色),toastFollowFail 展示失败提示(红色,可附带简短原因)。

关键步骤:

  • 引入 notyf 依赖及对应 CSS 文件。
  • 在应用入口初始化单例实例,避免重复 new。
  • 在保存跟进的 API 调用 then 回调中触发成功提示,catch 回调中触发失败提示。
  • 文案保持简短,错误提示可携带简要原因。

适用边界

本技能仅适用于轻量级操作反馈场景:保存跟进、表单提交、Demo 操作等。不要用它替代删除确认、支付确认等需要用户明确决策的高风险交互——这类场景应使用 SweetAlert 等确认弹窗。同时,本技能不处理站内信、推送通知等持久化消息通道。如果已有全局通知架构,将本技能作为补充层即可。

使用场景

  • 在客户跟进页面,保存跟进记录后用 Toast 提示保存成功或失败。
  • 表单提交后,不跳转页面,用轻提示反馈提交结果,适合多步操作。
  • Demo 演示增删改查时,用 Toast 即时显示操作成功或错误状态。
  • 调用跟进 API 后,根据 then/catch 状态用不同颜色提示用户。

适合人员

  • 全栈开发者:需要快速为表单和 API 操作添加即时反馈,不想重复写通知逻辑。
  • 产品演示者:在演示后台管理功能时,需要让操作结果即时可见,提升观众理解。
  • 前端工程师:正在集成轻量通知系统,希望避免多组件重复创建 Notyf 实例。
  • 后端转前端开发者:熟悉 API 调用流程,希望将 then/catch 状态直观展示给用户。