Angular 页面跳转后返回前页状态（输入的数据）丢失，有没有什么简单的包引入后就能像普通页面一样跳转后保留输入数据？
drymonfidelia · 252 天前 · 1884 次点击这是一个创建于 252 天前的主题，其中的信息可能已经有所发展或是发生改变。
12 条回复 • 2024-04-20 11:50:33 +08:00
 |
1
lisongeee 252 天前
> 就能像普通页面一样跳转后保留输入数据
好奇这个普通页面是哪种页面？ |
 |
2
solos 252 天前
搞个 service 存一下不就行了
|
 |
3
drymonfidelia OP |
|
4
lisongeee 252 天前
> 非 SPA 网站跳转后点返回按钮之前输入的内容都在
那是你看的网站自己使用内部逻辑去保留了数据 比如 V2EX 不是 spa 吧，但是你在顶部的搜索框随便输入几个字符(别按回车) 然后点击页面上其它地方的链接，再回来，这个搜索框的内容丢失了 而底部的输入框没有丢失是因为文本就存在 localStorage 里，回退的时候再取出来显示就行 |
|
5
drymonfidelia OP @lisongeee 不是这样的，你做个 html 页面里面只放一个 input 标签，输入点内容，打开别的页面再返回，input 里输入的内容还在
|
 |
6
acoo 252 天前
keepalive
|
 |
8
xwwsxp 252 天前
@drymonfidelia 不一样吧，v2ex 感觉不是 SPA ，是纯原生的，即 HTML 、CSS 、JavaScript 构建的，这种方式的返回按钮是通过浏览器的 history 来给你保存的，而 SPA 应用本质上就是利用的 history 的 API ，并且全是动态的 JS ，这个时候浏览器怎么可能给你保存，可以参考 Vue 中的 keepalive
|
|
9
xwwsxp 252 天前
@drymonfidelia 如果换用 React ，就是 document.createElement(xxx,docuemnt.createElement(xxx)) 这种无限套娃的方式构建的 SPA 应用，和原生差别很大。
|
|
10
xwwsxp 252 天前
@drymonfidelia 不一样吧，v2ex 感觉不是 SPA ，是纯原生的，即 HTML 、CSS 、JavaScript 构建的，这种方式点击返回按钮是通过浏览器的 history 来给你保存的，而 SPA 应用本质上就是利用的 history 的 API ，并且全是动态的 JS ，这个时候浏览器怎么可能给你保存，可以参考 Vue 中的 keepalive
|
 |
11
c3de3f21 252 天前
- 简单方式
- 实现一个 CacheService ，两个接口 setCache(key,data),getCache(key)，底层可以用 sessionStorage 实现 - 所有组件的状态都放到一个字段里 `state`，组件离开的时候 setCache('key,state) - 组件初始化的时候 getCache(key)?this.state = getCache(key):初始化 state - 复杂方式 - https://github.com/ng-alain/delon/blob/master/packages/abc/reuse-tab/provide.ts 可以看看 ng-alain 的 reuseTab 源码找找思路 |
Select Language