如果浏览器被意外关闭，react怎么缓存用户填写的表单？

Question

这是一个面试题：

在浏览器崩溃，断电，或手动关闭时，怎么缓存已经输入的不完整的表单，使页面重新加载后可以恢复已输入的数据呢？
考虑用 react 实现，这个问题的关注点在代码/逻辑的实现层面，暂时不考虑用户提示的问题

Q1：react 并没有 keep-alive 的东西吧？
Q2：redux 对浏览器级别的缓存好像也没啥作用，我回答了监听页面关闭，把数据存储在 localStorage 中，除此之外还有其他方案吗？
Q3：这种浏览器级的缓存有什么应用场景？
(以我浅薄的经验看，似乎没在项目中出现过这种需求）

---

根据 @_usw 的提示，我看了下思否的实现方式：

对于旧问题的编辑：它是在输入的表单（比如发布问题）做了个防抖，右上角有一个保存中...，定时提交已编辑的内容到远程，保存中变为已存草稿，如果页面或者浏览器被关闭，并不能恢复已经编辑的内容

对于新问题的编辑：同上，另外还同步更新了localStorage，浏览器被关闭后恢复也是拿的 localStorage 的数据

我试了下删除localStorage并刷新/关闭页面/关闭浏览器，之后页面重载，以上二者都没有获取草稿的相关请求（真是令人疑惑）

Answer 1

我记得react没有这种东西，要实现也只是组件主动设置浏览器本地缓存而已。
还能有啥，localStorage之外常见的就是存cookie，或者session

最直接的思路就是input组件自动持久化，表单容器组件有一个全局唯一ID的属性和是否自动保存属性，input组件都放之于表单容器组件内部，然后此表单的所有input组件都会以此ID为key，在适当的时机自动保存和恢复输入框中的数据，若打开了自动保存，表单容器组件会有个实时数据状态栏，正在保存表单数据，已恢复表单的数据，再就是如果是已登录用户，如果用户允许隐私协议，关键表单数据就备份到云端，这种就要加一个用户选择页面，选择比对从本地还是从云端恢复表单数据。

Answer 2

注册window.onunload事件，把内容缓存到本地，页面加载时读一下缓存看看有没有内容

Answer 3

如果真的是浏览器崩溃、断点等意外情况，感觉是需要提前将数据进行缓存的，用户每填一部分数据就进行缓存。