Vuex刷新数据保存问题，用户登录状态保持问题

1. Vuex 在页面刷新时的数据清除问题

原因：

1. js代码是运行在内存当中的，代码运行时的变量，函数，也都是保存在内存中的。
2. 刷新页面后，之前申请的所有内存会被释放，重新加载JavaScript代码，变量和函数将重新赋值和初始化。
3. 因此，刷新页面保留数据就必须使用外部存储——客户端 or 服务器

解决方法：
vuex中的变量是响应式的，而localStorage不是，当你改变vuex中的状态，组件会检测到改变，而 localStorage 就不会了，页面要重新刷新才可以看到改变，所以让vuex中的状态从localStorage中得到，这样组件就可以响应式地变化

localStorage.setItem(“key”, “value”) //以“key”为名称存储一个值“value”
localStorage.getItem(“key”) //获取名称为“key”的值
localStorage.removeItem(“key”) //删除名称为“key”的信息。
localStorage.clear() //清空localStorage中所有信息

2.用户登录态保持——面试题

面试官的要求：
登录后，再次进入页面，还保持着登录状态，但是长期不登陆，在进入，就需要重新登陆

正确的方式：
可以使用设置 cookie 和 token 来达到目的 (推荐使用流行的 JWT 登录认证模式)
如果存放在localStorage，他会永久存在，它没有设置过期时间的api，所以要设置一个过期时间

使用cookie的步骤：

1. 客户端请求后台登录接口。
2. 后台验证通过后，将用户的登录状态保存至cookie并写入客户端。
3. 客户端再次登录网站，请求login接口时，后台直接从客户端获取到该用户写入cookie的登录状态，并设置cookie过期时间。
4. 通过对该状态的验证，确认用户是否需要再次登录。
5. 如cookie过期，则跳转至登录页；如未过期，则直接显示为已登录状态。