解决$store.getters调用不执行的问题


Posted in Javascript onNovember 08, 2019

api:https://vuex.vuejs.org/zh/guide/getters.html

场景:

在登录时将登录得到的用户信息存储在vuex的state和sessionStorage中。使用时在state中获取,当因为刷新等原因导致state中没有数据时,去sissionStorage中获取。

错误:

登录后,需要获取用户信息时,getters中属性的方法不会执行。只是去getters中获取缓存

解决方法:

将getters中的属性改写成方法,这样每次调用的时候就会执行,去从新获取数据。

getloginInfor: (state) => () => {}

代码:

import Vue from 'vue'
import Vuex from 'vuex'
 
Vue.use(Vuex)
 
export default new Vuex.Store({
 state: {
 /* 登录用户信息 */
 loginInfor: {
 }
 },
 mutations: {
 setloginInfor (state, msg) {
  state.loginInfor = msg
 }
 },
 actions: {
 
 },
 getters: {
 getloginInfor: (state) => () => {
  // 先从state里面获取用户登录信息
  let loginInfo = state.loginInfo
  // 如果 state 里面获取不到,那么从localStorage里面获取
  if (!loginInfo) {
  loginInfo = JSON.parse(sessionStorage.getItem('loginInfo'))
  }
  return loginInfo
 }
 }
})

使用:

this.$store.getters.getloginInfor()

钻研不易,转载请注明出处。。。。。。

以上这篇解决$store.getters调用不执行的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS函数实现动态添加CSS样式表文件
Dec 15 Javascript
JS去除数组重复值的五种不同方法
Sep 06 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
Apr 20 Javascript
一个Action如何调用两个不同的方法
May 22 Javascript
js实现同一页面多个不同运动效果的方法
Apr 10 Javascript
基于react框架使用的一些细节要点的思考
May 31 Javascript
关于Vue背景图打包之后访问路径错误问题的解决
Nov 03 Javascript
Vue+ElementUI实现表单动态渲染、可视化配置的方法
Mar 07 Javascript
D3.js的基础部分之数组的处理数组的排序和求值(v3版本)
May 09 Javascript
js核心基础之闭包的应用实例分析
May 11 Javascript
浅谈Vue3.0新版API之composition-api入坑指南
Apr 30 Javascript
解决基于 keep-alive 的后台多级路由缓存问题
Dec 23 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 #Javascript
vue.js的状态管理vuex中store的使用详解
Nov 08 #Javascript
vue.js 子组件无法获取父组件store值的解决方式
Nov 08 #Javascript
VUEX采坑之路之获取不到$store的解决方法
Nov 08 #Javascript
vue路由拦截器和请求拦截器知识点总结
Nov 08 #Javascript
Vue打包后访问静态资源路径问题
Nov 08 #Javascript
在vue中使用echars实现上浮与下钻效果
Nov 08 #Javascript
You might like
一步一步学习PHP(2)――PHP类型
2010/02/15 PHP
关于Iframe如何跨域访问Cookie和Session的解决方法
2013/04/15 PHP
ThinkPHP框架任意代码执行漏洞的利用及其修复方法
2014/07/04 PHP
thinkPHP框架可添加js事件的分页类customPage.class.php完整实例
2017/03/16 PHP
Thinkphp 框架基础之入口文件功能、定义与用法分析
2020/04/27 PHP
js最简单的拖拽效果实现代码
2010/09/24 Javascript
JavaScript图像延迟加载库Echo.js
2016/04/05 Javascript
jquery中实现时间戳与日期相互转换
2016/04/12 Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
2016/05/18 Javascript
函数四种调用模式以及其中的this指向
2017/01/16 Javascript
BootStrap实现文件上传并带有进度条效果
2017/09/11 Javascript
Angular中点击li标签实现更改颜色的核心代码
2017/12/08 Javascript
10个经典的网页鼠标特效代码
2018/01/09 Javascript
echarts鼠标覆盖高亮显示节点及关系名称详解
2018/03/17 Javascript
小程序如何使用分包加载的实现方法
2019/05/22 Javascript
Python中返回字典键的值的values()方法使用
2015/05/22 Python
Python中摘要算法MD5,SHA1简介及应用实例代码
2018/01/09 Python
django 开发忘记密码通过邮箱找回功能示例
2018/04/17 Python
IntelliJ IDEA安装运行python插件方法
2018/12/10 Python
实例讲解Python中浮点型的基本内容
2019/02/11 Python
python用for循环求和的方法总结
2019/07/08 Python
python tkinter实现彩球碰撞屏保
2019/07/30 Python
Python破解BiliBili滑块验证码的思路详解(完美避开人机识别)
2020/02/17 Python
关于Theano和Tensorflow多GPU使用问题
2020/06/19 Python
HTML5 Canvas画线技巧——实现绘制一个像素宽的细线
2013/08/02 HTML / CSS
荷兰网上鞋店:Ziengs.nl
2017/01/02 全球购物
Rag & Bone官网:瑞格布恩高级成衣
2018/04/19 全球购物
西班牙在线药店:DosFarma
2020/03/28 全球购物
设计师大码女装:11 Honoré
2020/05/03 全球购物
营销与策划专业毕业生求职信
2013/11/01 职场文书
行政专员岗位职责
2014/01/02 职场文书
2014年上半年工作自我评价
2014/01/18 职场文书
法英专业大学生职业生涯规划书范文
2014/09/22 职场文书
公积金接收函格式
2015/01/30 职场文书
微软Win11有哪些隐藏功能? windows11多个功能汇总
2021/11/21 数码科技
bat批处理之字符串操作的实现
2022/03/16 Python