vue 组件刷新后数据保存问题

  1. 页面结构如下:

    app.vue 根组件
        |----login.vue
        |----home.vue
  2. 我在login.vue 做登录成功后的数据保存, 将数据保存到app.vue想作为全局的变量来使用, 然后跳转到home.vue, 但是, 当我在home.vue页面刷新时, home.vue 访问到的app.vue下的数据就为空了,

  3. 请问: 这个情况我需要怎么做, 或者vue中我们需要怎么保存全局变量

阅读 7.1k
评论
    10 个回答

    页面刷新之后 Vue 实例中的数据就没了,如果需要保存数据,需要使用 localStorage、sessionStorage 或者 cookie

      • 2.6k

      我有一个项目是这样做的:

      因为后端的session如果服务器不重启、时效没过的话会一直存在的、

      前段路由的钩子函数触发、检测到vuex里面没有用户信息的话、

      第一次访问的时候会去后端拿session、

      后端session如果取不到、就去登陆页面、如果取得到、返回信息、存入vuex里面

        你存的变量是零时变量,页面刷新就没了,可以保存在localStorage里面,保存在vuex中的state里面也是不可以的,也是零时变量,刷新就没了!

          vuex和将数据保存在根组件是针对单页应用路由问题,及组件间数据传递问题的,你界面刷新所有组件都是重新构建的,哪里来的数据?刷新界面如果需要保存数据可以通过各楼提到的localStorage,sessionStorage或则cookie

            localStorage是常用的存储数字的方法之一,方法名也比较讲道理。
            引用一篇张鑫旭的文章可以看看

            http://www.zhangxinxu.com/wor...

              • 3.8k

              应该可以使用vue的props来在各个compnents数据之间交互,当然也可以使用webStorage来实现

                我的项目之前就是存在localStorage里面的,不过给你的建议是最好设置一个退出登录,然后清除localStorage,毕竟为了安全。

                  程序是运行在内存中的啊大兄弟,,,刷新了内存自然就释放了哪里还有数据

                    要么使用 vuex 存放在 state 里面,要么存放本地存储 localStorage

                      用户登录状态应该保存到 cookie 中

                        撰写回答

                        登录后参与交流、获取后续更新提醒