
接到一个需求 要我去做一个 tab 切换页面的功能 需求是这样说的:
如果用户在 a 页面添写一些表单,同时要查看 b 页面,希望能在同一个 url 下进行切换,切换后 a 页面输入的数据依旧存在,且可以随时切换。
我的思路是去拿页面的模版,进行页面上的替换 但是这样就会遇到一个问题
如果用户刷新页面,那刷新的是当前页面,可是我好像没办法阻止浏览器默认的刷新事件。能保证 a 页面的表单不被清空,请教一下大佬我该如何实现该功能。
1 nwu2Cv8OZ2MZMg39 2019-08-22 11:39:24 +08:00 keep-alive |
2 m939594960 2019-08-22 11:40:02 +08:00 {current_tab:"a_data",a_data:{"name":2},b_data:{"name":2}} |
3 biabia123456 2019-08-22 11:40:27 +08:00 keep-alive +1 冻结之前的页面 会多一个生命周期为 activated |
4 m939594960 2019-08-22 11:41:08 +08:00 watch:(a_data){ localstorage['a_data']=a_data } |
5 mikoshu 2019-08-22 11:41:10 +08:00 keep-alive 完美解决 |
6 biabia123456 2019-08-22 11:41:42 +08:00 如果要实现用户刷新页面 那就只有数据存下来然后回填了 |
7 T3RRY 2019-08-22 11:47:25 +08:00 学到了 |
8 gzlock 2019-08-22 11:49:31 +08:00 via Android 使用 onbeforeunload 事件在网页关闭 /刷新前提示用户会丢失数据 在父组件或 vuex 存数据 4 楼的做法可以更进一步,使用 computed 将整个表单数据使用 localstorage 存与取 |
9 moxiaonai 2019-08-22 12:00:01 +08:00 via Android keep alive, vuex 都可以 |
10 X37B 2019-08-22 17:43:38 +08:00 |