前端面试之-vue

一.页面刷新后得vuex的state数据丢失怎么办？

1.为什么数据会丢失？
因为store里的数据是保存在运行内存中的，当页面刷新时，页面会重新加载vue实例，store里面的数据就会被重新赋值初始化。
2.解决办法
a.可以使用浏览器存储如localStorage,sessionStorage等，刷新后读取赋值。具体使用哪个可根据业务需求选择。
b.对一些没有必要存储的请求接口数据，直接通过接口重新获取。
c.也可以使用一些插件，如vuex-persistedstate,可以自动存储数据。

二. Vue切换路由的时候，需要保存当时状态的功能，怎么实现呢？

一.方式一  beforeRouteLeave
    beforeRouteLeave(to,from,next) {
      if('用户已经输入了信息'){
        // 出现弹窗提醒保存草稿，或者自动后台为其保存
        // do something
      }else {
        next(true) //用户离开
        }
      }
    
 1.可以在这里把数据存储到vuex中，缺点是页面刷新数据会丢失；
 2.存储到localStorage中且与vuex关联一起
 3.存储到数据库中

二.方式二 keep-alive
    使用keep-alive缓存。