将api数据放在vuex中正常刷新页面后重新获取接口数据存入vuex中却变为空了?

foxSay
  • 17

我将接口请求回来的数据都放在vuex中,一直使用正常,但是当我手动刷新页面的时候数据却变为空了,虽然每次刷新vuex会被清空,但是我的接口请求操作和将请求到的数据放入vuex中的操作明明都是写在mounted阶段,这样的话即便刷新也能将数据重新放入vuex中,为什么会出现空的情况呢?

回复
阅读 2.9k
2 个回答

页面重载后,Vuex中的内容也会被重载。
要想不被丢失直接本地存储,可以改用localstorage 或者 sessionstorage

说下自己的做法吧
src/api 目录下创建接口层 负责接口的请求 在里面只请求接口
src/store/module 目录下创建模块 在actions 里面请求执行api层里面的方法
在组件里面的 mounted 判断vuex里面的 state 里面的数据是否为空 如果为空 执行this.$store.dispatch('asdad')

        computed:{
            articles(){
                return this.$store.state.module.data
            }
        },
        mounted(){
            if (this.articles <= 0){
                this.$store.dispatch('actions里面的方法名')
            } 
        }
宣传栏