1。原因（1）js代码是在内存中运行的，代码运行时的所有变量和函数都保存在内存中。(2)刷新页面，释放之前申请的内存，重新加载脚本代码，必须重新赋值变量。(3)如果刷新后数据不丢失，则数据必须存储在外部，例如：LocalStorage、SessionStorage、IndexDB等。这些是浏览器提供的API，可以让你把数据存储在硬盘上用于持久存储的磁盘。2、HTML5在客户端提供了两种新的数据存储方式：localStorage存储数据：（1）存储的数据是永久的，永不过期；(2)范围仅限于文档源级别。同源文档共享同一个localStorage数据（不管源脚本是否实际访问localStorage）。他们可以读取彼此的数据，甚至可以覆盖彼此的数据。但是，不同来源的文档不能读取或覆盖彼此的数据。（即使他们运行的脚本来自同一个第3方服务器也不行）。sessionStorage存储数据：（1）session，当浏览器关闭时，session结束，数据清空，有时间限制；(2)存储数据的有效期与存储数据的脚本所在的最顶层窗口或浏览器选项卡相同，一旦窗口或选项卡永久关闭，所有通过sessionStorage存储的数据也将被删除。3.具体实现（登录后保存状态，退出后移除状态）//vuexmutationsconstmutations={setToken(state,token){//保存用户认证TokensessionStorage.setItem('token',token);state.token=令牌；},setUser(state,user){//保存用户信息sessionStorage.setItem('user',JSON.stringify(user));state.user=用户；},//注销并清除令牌logout(state){state.token=null;state.user=null;sessionStorage.removeItem('token');sessionStorage.removeItem('用户');}};//vuexgettersconstgetters={getToken(state){if(state.token===null){state.token=sessionStorage.getItem('token')}returnstate.token;},//获取当前用户登录信息getUser(state){if(state.user===null){state.user=JSON.parse(sessionStorage.getItem('user'));}返回状态。用户；}};
