Angular 页面跳转后返回前页状态（输入的数据）丢失，有没有什么简单的包引入后就能像普通页面一样跳转后保留输入数据？
drymonfidelia · Apr 19, 2024 · 6448 viewsThis topic created in 928 days ago, the information mentioned may be changed or developed.
 |
lisongeeeApr 19, 2024
1
> 就能像普通页面一样跳转后保留输入数据
好奇这个普通页面是哪种页面？ |
 |
solosApr 19, 2024
2
搞个 service 存一下不就行了
|
 |
3
|
|
lisongeeeApr 19, 2024
4
> 非 SPA 网站跳转后点返回按钮之前输入的内容都在
那是你看的网站自己使用内部逻辑去保留了数据 比如 V2EX 不是 spa 吧，但是你在顶部的搜索框随便输入几个字符(别按回车) 然后点击页面上其它地方的链接，再回来，这个搜索框的内容丢失了 而底部的输入框没有丢失是因为文本就存在 localStorage 里，回退的时候再取出来显示就行 |
|
5
@lisongeee 不是这样的，你做个 html 页面里面只放一个 input 标签，输入点内容，打开别的页面再返回，input 里输入的内容还在
|
 |
0xbeApr 19, 2024
6
keepalive
|
 |
zhuisuiApr 19, 2024
7
|
 |
xwwsxpApr 19, 2024
8
@drymonfidelia 不一样吧，v2ex 感觉不是 SPA ，是纯原生的，即 HTML 、CSS 、JavaScript 构建的，这种方式的返回按钮是通过浏览器的 history 来给你保存的，而 SPA 应用本质上就是利用的 history 的 API ，并且全是动态的 JS ，这个时候浏览器怎么可能给你保存，可以参考 Vue 中的 keepalive
|
|
xwwsxpApr 19, 2024
9
@drymonfidelia 如果换用 React ，就是 document.createElement(xxx,docuemnt.createElement(xxx)) 这种无限套娃的方式构建的 SPA 应用，和原生差别很大。
|
|
xwwsxpApr 19, 2024
10
@drymonfidelia 不一样吧，v2ex 感觉不是 SPA ，是纯原生的，即 HTML 、CSS 、JavaScript 构建的，这种方式点击返回按钮是通过浏览器的 history 来给你保存的，而 SPA 应用本质上就是利用的 history 的 API ，并且全是动态的 JS ，这个时候浏览器怎么可能给你保存，可以参考 Vue 中的 keepalive
|
 |
c3de3f21Apr 19, 2024
11
- 简单方式
- 实现一个 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 源码找找思路 |
 |
scungApr 20, 2024
12
|
Select Language