• Vue刷新页面VueX中数据清空了,怎么重新获取?


    Vue刷新页面VueX数据清空了,怎么重新获取?

    点击打开视频讲解更详细

    在vue中刷新页面后,vuex中的数据就没有了,这时我们要想使用就要重新获取数据了,
    怎么在刷新后重新获取数据呢???

    这时我们就可以写个公共的方法,在公共页面(可以是根页面)判断store仓库中数据是否为空,若为空的话,就可以重新请求接口,拉取数据。当然你也可以在每次使用数据前判断是否为空,若为空就重新请求数据,这样的话就时写的代码有的繁琐了。

    但这其实存在一个小bug,就是在根页面我们拉取数据的时间段中,当前页面中正好使用的有要拉取的数据,但现在数据还在请求,store中数据为空啊,所以我们就拿不到数据了,等到请求完数据,我们当前页面也已经渲染完毕,所以数据还是拿不到的,这时我们就可以用watch监听store中数据的变化,这样的话,就不用怕拿不到数据了。

    App.vue

    
    
    
    
    
    

    src\store\index.js

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const store = new Vuex.Store({
      state: {
        list : []
      },
      mutations: {
        increment (state,list) {
          state.list = list 
        }
      }
    })
    
    export default store;
    

    若对您有帮助,请点击跳转到B站一键三连哦!感谢支持!!!

  • 相关阅读:
    mysql入门
    低代码开发之腾讯云微搭工具
    mysql json类型映射查询
    Flink CDC 菜鸟教程-工具概念篇
    C++多线程同步
    Qt使用FFmpeg的动态库
    六、阻塞队列与源码分析(上)
    2.5 贝叶斯分类器
    php设计模式之策略模式详解
    ORM多表外键字段的操作
  • 原文地址:https://www.cnblogs.com/mochenxiya/p/16626616.html