点「删除」后气泡紧贴按钮弹出，标题写「确认删除「寒假计划」？」、正文写「无法恢复」；Esc、点外部、取消都能安全退出；确认中禁用防连点；点确认后这一行从列表移除——手滑不会直接删，删了也知道删了什么。
先开一次确认气泡，看它和触发器、列表的关系
一台草稿列表删除确认实验台：点任一行的「删除」，气泡会贴在该行按钮旁弹出（背景列表不被遮罩盖住）；打开后焦点落在「确认删除」，按 Esc、点外部或点取消都可安全退出；点「确认删除」后该行从列表移除，结果长在物件上——对照 modal 用全屏遮罩强制阻断，popconfirm 不打断主流程。
- 寒假计划
- 活动报名页
- 开学第一课
默认：每行草稿旁有删除按钮。点任一「删除」会就地弹出确认气泡（无遮罩），焦点落在「确认删除」；按 Esc、点外部或点取消都可安全退出，只有点「确认删除」才会真正删除那一行。
从刚才的操作里提炼
你在实验台上看到的就是 popconfirm 的核心；下面只是把它命名清楚。
- 气泡贴触发器、无遮罩：气泡出现在「删除」按钮旁，背景列表始终可见可读——popconfirm 不打断主流程，这是它和全屏遮罩 modal 的关键区别。
- 就地二元确认：内容只有「确认文案 + 取消 / 确认」，专做危险或不可逆操作前的二次决策；需要表单或长内容时该升级为 modal 或 popover。
- 三条安全退路：Esc、点外部、点取消都能关闭气泡且不改数据；焦点打开时进气泡、关闭后回到触发按钮。
- 确认才执行，结果落在物件上：只有点「确认删除」才真正删除（主 CTA 是唯一的 Rausch），确认中禁用防连点；完成后对应行从列表移除。
什么时候用 popconfirm
从用户信号判断，也要知道它与相邻临时层组件的边界。
- 用：危险或不可逆、但轻量的就地确认，如删除一行、移除成员、撤销发布、清空一项。
- 用：不需要表单、不需要强制阻断，只需「是 / 否」二次决策的危险动作。
- 区分 Modal：Modal 是全屏遮罩 + 焦点陷阱，强制阻断主流程、承载表单或详情；popconfirm 是小气泡、无遮罩、只做二元确认。
- 区分 Popover：Popover 是通用浮层，可装表单、菜单、资料卡等丰富内容；popconfirm 专做确认，内容固定为文案 + 确认 / 取消。
- 区分 Alert：Alert 是页内持续提示条，不需要点击就一直在；popconfirm 是点击触发的临时气泡，确认或取消后即消失。
- 区分 Tooltip：Tooltip 是悬停 / 聚焦时的简短说明、不可操作；popconfirm 是点击触发、含可操作按钮的确认气泡。
- 不用：成功反馈（用 Toast）、整页结果（用 Result）、悬停说明（用 Tooltip）、持续提示条（用 Alert）。
怎么用：从触发到结果的最短路径
让一次气泡确认说清对象、后果和退路，并把结果落在原物件上。
- 触发：挂在危险按钮上，点击后气泡紧贴触发器定位（上 / 下 / 左 / 右依空间而定），不遮住关键信息。
- 写文案：标题写「确认 + 动词 + 对象名」，正文写后果；危险操作用危险样式 + 文字，不只靠颜色。
- 进气泡：容器用
role="alertdialog"，aria-labelledby指标题、aria-describedby指说明；打开后焦点移入气泡。 - 给退路：Esc 关闭、点外部关闭、取消按钮关闭，三条都要可用；关闭后焦点回到触发按钮。
- 防连点：确认中禁用确认与取消按钮，等当前请求完成再恢复，避免重复提交。
- 落结果：确认后执行操作，结果落在被操作的原物件上（行消失、状态变更），再关闭气泡；可选叠加 Toast 做轻反馈。
正反例：同一个删除，只改一处
围绕同一个删除草稿场景，只改变「是否给安全退路并说清删什么」，看用户后果如何不同。
没有确认步骤、点删除立刻生效，手滑即删且无退路；或气泡文案只写「确认？」不含对象名——用户不知道正在删哪一行，键盘用户也找不到取消；删没删成还得靠猜。
快速自测
团队列表里点「移除成员」（不可逆），最适合用什么提醒用户？
继续查证
术语的技术定义和行为以这些一手或权威资料为准。
下一步学
和本知识点经常一起出现的概念。