G4.07.3keep unsubmitted drafts across casual navigation设计研究

未提交的输入草稿应随导航离开保留,而非清空

别名: 导航保留草稿 · unsaved draft · 离开不清空 · in-session draft

概念解释

评论框写到一半,人去核对一条资料、点开一张图、切到另一条会话再回来,未发送的字应还在。随导航离开保留草稿,针对的是同一次会话里的短暂走开,不是跨天的长流程存档,也不是崩溃抢救。清空发生在路由把输入组件卸载、又按初始值挂回来的那一刻——人以为自己只是看了一眼别处。

机制

输入草稿活在组件实例里。SPA 把「离开」实现成卸载,实例死了,值就死了。浏览器对普通表单在 bfcache 命中时会保住字段,但许多站点禁用缓存,或用可编辑 div 冒充输入,返回即空。人把导航当成暂时的注意转移,工作记忆里还挂着那句话;空框把转移升级成损失。损失还不可见:没有提交失败,没有错误,只是字不在了,直到开始继续写才发现。

同会话保留的粒度是「这个对象上的未提交输入」:这条评论、这张工单的描述、这个搜索框里未发出的改写。它跟账号侧的申请进度不是同一份对象——关标签后可以丢,刷新后最好还在。把每次路由变化写成 reset(),等于宣布「看别处 = 放弃这句话」。

怎么研究

在输入框打入一句不可从别处复制的话,导航到站内另一页再返回(或打开模态再关),比较组件保活、session 级草稿、卸载即清空。

  • 因变量:返回后文本是否逐字还在、发现丢失的时间、是否重打。
  • 自变量:离开方式(路由 / 模态 / 新标签)、存储(仅内存 / sessionStorage / 无)。
  • 方法论注意点:指导语若说「请记住你写的」,人会先复制,测的是记忆不是草稿。要在他们以为还会继续写的时候让他们走开。不要把「点了取消」和「点了别处一条链」混在一起——取消是放弃,导航不是。长流程存档研究测的是跨会话游标,这里只测同会话往返。

边界

用户点了「清空」「取消」或发送成功,草稿应消失。密码、验证码、支付要素即使同会话也不该写入可恢复层。公共屏幕上的输入离开后应丢,以免下一眼被旁观者看见。新标签打开的同一表单是另一份实例,默认同步会造成两处抢写,除非产品明确是协作编辑。

怎么落地

  • 对有意义的未提交输入,在卸载前写入会话级存储(按对象 id 分键);该对象再次挂载时读回,不要用初始空值。
  • 列表进详情再回列表,评论框若还对着同一对象,必须读回。
  • 发送成功或显式取消时删掉该键。
  • 验证:写半句评论,点开一张图或另一条详情,返回。半句还在。刷新同页,最好还在。换一个对象再回来,不应串到别人的草稿。把实现改成卸载即 setState('') 作为反例,同一操作会丢字。

延伸

  • 同组G4.07.1 列表内容在离开期间变化时,恢复位置应定位到具体项而非绝对滚动量 · G4.07.2 无限滚动列表的位置恢复依赖已加载数据量,返回过深会触发重新加载 · G4.07.4 位置恢复失效需说明原因,例如内容已被删除或重排 · G4.07.5 跨设备续读需要把位置数据存储在账号侧而非本地状态
  • 相邻G4.05 断点续做 · H1.08 草稿自动保存 · G4.08 外部链接与离开提示
  • 站内检索unsaved draft · in-session persistence · comment draft

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/G4.07.3