解决$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 相关文章推荐
从JavaScript的函数重名看其初始化方式
Mar 08 Javascript
jquery.validate使用攻略 第一部
Jul 01 Javascript
基于jquery的表头固定的若干方法
Jan 27 Javascript
js限制文本框输入长度两种限制方式(长度、字节数)
Dec 19 Javascript
分享JavaScript获取网页关闭与取消关闭的事件
Dec 13 Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
Sep 04 Javascript
javascript添加前置0(补零)的几种方法
Jan 05 Javascript
JS中Safari浏览器中的Date
Jul 17 Javascript
Angular2监听页面大小变化的解决方法
Oct 09 Javascript
详解使用vue-cli脚手架初始化Vue项目下的项目结构
Mar 08 Javascript
javascript中的event loop事件循环详解
Dec 14 Javascript
vue实现数字动态翻牌的效果(开箱即用)
Dec 08 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
ThinkPHP独立分组使用的注意事项
2014/11/25 PHP
php实现在多维数组中查找特定value的方法
2015/07/29 PHP
PHP将二维数组某一个字段相同的数组合并起来的方法
2016/02/26 PHP
PHP实现求解最长公共子串问题的方法
2017/11/17 PHP
CentOS7.0下安装PHP5.6.30服务的教程详解
2018/09/29 PHP
JavaScript面向对象之体会[总结]
2008/11/13 Javascript
JQuery 学习笔记 选择器之三
2009/07/23 Javascript
基于jquery的表头固定的若干方法
2011/01/27 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
js读写json文件实例代码
2014/10/21 Javascript
关于Bootstrap弹出框无法调用问题的解决办法
2016/03/10 Javascript
简述Matlab中size()函数的用法
2016/03/20 Javascript
AngularJS动态绑定HTML的方法分析
2016/11/07 Javascript
JS判断是否为JSON对象及是否存在某字段的方法(推荐)
2016/11/29 Javascript
js+css3实现旋转效果
2017/01/20 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
Node.js使用Angular简单示例
2018/05/11 Javascript
HTML+JavaScript实现扫雷小游戏
2019/09/30 Javascript
JavaScript设计模式之门面模式原理与实现方法分析
2020/03/09 Javascript
Vue-cli 移动端布局和动画使用详解
2020/08/10 Javascript
[05:35]DOTA2英雄梦之声_第13期_拉比克
2014/06/21 DOTA
[02:05:03]完美世界DOTA2联赛循环赛 LBZS VS Matador BO2 10.28
2020/10/28 DOTA
python算法学习之桶排序算法实例(分块排序)
2013/12/18 Python
python实现数通设备端口监控示例
2014/04/02 Python
python实现simhash算法实例
2014/04/25 Python
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
Python多线程下载文件的方法
2015/07/10 Python
Django中的Model操作表的实现
2018/07/24 Python
Python中最大递归深度值的探讨
2019/03/05 Python
python基础梳理(一)(推荐)
2019/04/06 Python
基于Python爬取fofa网页端数据过程解析
2020/07/13 Python
关于礼仪的演讲稿
2014/01/04 职场文书
复试通知单模板
2015/04/24 职场文书
2015年材料员工作总结
2015/04/30 职场文书
2016年寒假见闻
2015/10/10 职场文书
Python制作表白爱心合集
2022/01/22 Python