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

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调用不执行的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 如何为vuex实现带参数的 getter和state.commit

    getter 带参数 参考: https://vuex.vuejs.org/guide/getters.html#method-style-access 或者: https://stackoverflow.com/questions/37763828/javascript-es6-double-arrow-functions 官方例子: getters: { // ... getTodoById: (state) => (id) => { return state.todos.find(tod

  • 详解vuex之store源码简单解析

    关于vuex的基础部分学习于https://www.jb51.net/article/163008.htm 使用Vuex的时候,通常会实例化Store类,然后传入一个对象,包括我们定义好的actions.getters.mutations.state等.store的构造函数: export class Store { constructor (options = {}) { // 若window内不存在vue,则重新定义Vue if (!Vue && typeof window !== '

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

    api:https://vuex.vuejs.org/zh/guide/getters.html 场景: 在登录时将登录得到的用户信息存储在vuex的state和sessionStorage中.使用时在state中获取,当因为刷新等原因导致state中没有数据时,去sissionStorage中获取. 错误: 登录后,需要获取用户信息时,getters中属性的方法不会执行.只是去getters中获取缓存 解决方法: 将getters中的属性改写成方法,这样每次调用的时候就会执行,去从新获取数据.

  • C#调用WinRar执行rar、zip压缩的方法

    本文实例讲述了C#调用WinRar执行rar.zip压缩的方法.分享给大家供大家参考.具体如下: 判断系统是否安装了winrar /// <summary> /// 验证WinRar是否安装. /// </summary> /// <returns>true:已安装,false:未安装</returns> private static bool ExistsRar(out String winRarPath) { winRarPath = String.Em

  • Java实现调用jython执行python文件的方法

    本文实例讲述了Java实现调用jython执行python文件的方法.分享给大家供大家参考,具体如下: 在web开发时候,经常在web环境使用本地环境的第三方库什么的,本文讲解java如何执行python文件. 网上说方法有三种,其实也就两种,下面着中介绍第二种通过(jython). 方法一 java.lang.Runtime Runtime rt = Runtime.getRuntime(); try { Process proc = rt.exec("python /tmp/test.py&

  • Java程序去调用并执行shell脚本及问题总结(推荐)

    摘要: 该文章来自阿里巴巴技术协会(ATA)精选集 背景 我们在开发过程中,大部分是java开发, 而在文本处理过程中,主要就是脚本进行开发. java开发的特点就是我们可以很早地进行TDDL, METAQ 等等地对接: 而脚本开发的特点就是在进行批处理的时候非常方便. 背景 我们在开发过程中,大部分是java开发, 而在文本处理过程中,主要就是脚本进行开发. java开发的特点就是我们可以很早地进行TDDL, METAQ 等等地对接: 而脚本开发的特点就是在进行批处理的时候非常方便. 前阵子我

  • 在docker容器中调用和执行宿主机的docker操作

    首先这个帖子,献给docker新手.当然如果你是一个老手,文中分割线后的操作方法也是一种思路. 首先说一下,如何在docker中执行宿主机的docker操作,我们管它叫docker in docker. 至于为什么要在docker中操作宿主机的docker,优点不言而喻,你既可以将你的具体需求容器化部署,又不用直接在宿主机上安装(假设我们没有办法在docker中操作宿主机的docker,那么我们只能将这样的软件程序直接安装到宿主机上,这样显然是不利于管理和维护的). 实现这种需求,其实非常简单,

  • C++调用python(执行py文件)的全过程

    C++调用python(执行py文件)的全过程

    1.首先要配好vs开发工程 注意版本:我这使用32位的python那么我vs工程这边也选择32位的编译环境去配置 注意点:需要将python安装目录的一些文件拷过来作为vs工程使用. 2.C++调用Python结果 py代码 这里引用了cdll库也需要放置到运行目录,py文件也是需要放置到运行目录(也就是exe生成所在目录) import os import time from ctypes import * def testDLL(): pDll = CDLL("./pythonTestCDl

  • python如何实现异步调用函数执行

    在实现异步调用之前我们先进行什么是同步调用和异步调用 同步:是指完成事务的逻辑,先执行第一个事务,如果阻塞了,会一直等待,直到这个事务完成,再执行第二个事务,顺序执行 异步:是和同步相对的,异步是指在处理调用这个事务的之后,不会等待这个事务的处理结果,直接处理第二个事务去了,通过状态.通知.回调来通知调用者处理结果 分析一下,下面的例子: 定义了一个装饰器 async 和 A .B 两个function 函数 A 里面sleep 10s , 然后打印 a function 字符串 B 里面直接打

  • win下调用putty执行命令脚本分享

    复制代码 代码如下: @echo offecho ===============================echo Production serverecho ===============================echo please input "y" to continue......set /p input=if "%input%"=="y" ("putty.exe" -pw serverPassword

  • vue基础入门之vuex安装与使用

    vue基础入门之vuex安装与使用

    目录 1.什么是vuex 2.安装和引入 3.vuex的使用 4.流程介绍 5.mutation 6.getters过滤 7.Action--异步处理 8.Module 总结 本教程为入门教程,如有错误,请各位前端大佬指出. 1.什么是vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.详细介绍可以参照官网文档vuex.vuejs.org/zh/ 下面简单介绍vuex 2.安装和引入

  • vuex通过getters访问数据为undefined问题及解决

    vuex通过getters访问数据为undefined问题及解决

    目录 getters访问数据为undefined问题 写一个类似例子 vuex getters(组件mounted调用)使用注意 逻辑 解决方案 getters访问数据为undefined问题 本篇文章可能对你的帮助不大, 只是个人开发中的一些记录.不同的业务和应用场景可能问题不同. 在通过 uni-app 开发商城时,用户快捷登录之后,服务器返回一个 token 数据,我将其同步到 vuex module下的 user 模块中. 然后从登录页返回到用户页,并发起 http 请求,获取用户的个人

随机推荐