解决$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 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
js动态改变select选择变更option的index值示例
Jul 10 Javascript
在Google 地图上实现做的标记相连接
Jan 05 Javascript
JavaScript限定图片显示大小的方法
Mar 11 Javascript
简介JavaScript中用于处理正切的Math.tan()方法
Jun 15 Javascript
解析利用javascript如何判断一个数为素数
Dec 08 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
Aug 09 Javascript
JS SetInterval 代码实现页面轮询
Aug 11 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
Apr 13 Javascript
D3.js的基础部分之数组的处理数组的排序和求值(v3版本)
May 09 Javascript
Vue2.x通用编辑组件的封装及应用详解
May 28 Javascript
JS箭头函数和常规函数之间的区别实例分析【 5 个区别】
May 27 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里得到前天和昨天的日期的代码
2007/08/16 PHP
PHP模板解析类实例
2015/07/09 PHP
jQuery chili图片远处放大插件
2009/11/30 Javascript
JavaScript对象、属性、事件手册集合方便查询
2010/07/04 Javascript
js中字符替换函数String.replace()使用技巧
2011/08/14 Javascript
window.open的页面如何刷新(父页面)上层页面
2012/12/28 Javascript
Bootstrap与KnockoutJs相结合实现分页效果实例详解
2016/05/03 Javascript
window.open不被拦截的简单实现代码(推荐)
2016/08/04 Javascript
妙用Bootstrap的 popover插件实现校验表单提示功能
2016/08/29 Javascript
AngularJs bootstrap详解及示例代码
2016/09/01 Javascript
bootstrap-datetimepicker实现只显示到日期的方法
2016/11/25 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
2017/07/10 Javascript
详解jquery插件jquery.viewport.js学习使用方法
2017/09/08 jQuery
js正则表达式校验指定字符串的方法
2018/07/23 Javascript
Vue.directive使用注意(小结)
2018/08/31 Javascript
js 计数排序的实现示例(升级版)
2020/01/12 Javascript
python中list常用操作实例详解
2015/06/03 Python
Python的组合模式与责任链模式编程示例
2016/02/02 Python
Windows下搭建python开发环境详细步骤
2020/07/20 Python
Python中单例模式总结
2018/02/20 Python
基于anaconda下强大的conda命令介绍
2018/06/11 Python
Python实现识别图片内容的方法分析
2018/07/11 Python
python 获取毫秒数,计算调用时长的方法
2019/02/20 Python
使用django的objects.filter()方法匹配多个关键字的方法
2019/07/18 Python
tensorflow指定CPU与GPU运算的方法实现
2020/04/21 Python
浅谈pymysql查询语句中带有in时传递参数的问题
2020/06/05 Python
Python实现验证码识别
2020/06/15 Python
python 制作网站小说下载器
2021/02/20 Python
html5页面结构_动力节点Java学院整理
2017/07/10 HTML / CSS
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
宣传部部长竞选演讲稿
2014/04/26 职场文书
社会实践活动总结报告
2014/04/29 职场文书
一份关于丢失公司财物的检讨书
2014/09/19 职场文书
80后创业总结的9条职场用人思想,记得收藏
2019/08/13 职场文书
MySQL 慢查询日志深入理解
2021/04/22 MySQL
Python Matplotlib绘制等高线图与渐变色扇形图
2022/04/14 Python