Vue 若依框架常见问题

news2025/6/12 22:45:11

获取当前用户id或其它信息

user.js
在这里插入图片描述

import { login, logout, getInfo } from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/auth'

const user = {
  state: {
    token: getToken(),
    id: '',
    name: '',
    avatar: '',
    roles: [],
    permissions: [], 
    shop: [] // 店铺列表
  },

  mutations: {
    SET_TOKEN: (state, token) => {
      state.token = token
    },
    SET_ID: (state, id) => {
      state.id = id
    },
    SET_NAME: (state, name) => {
      state.name = name
    },
    SET_AVATAR: (state, avatar) => {
      state.avatar = avatar
    },
    SET_ROLES: (state, roles) => {
      state.roles = roles
    },
    SET_PERMISSIONS: (state, permissions) => {
      state.permissions = permissions
    },
    SET_SHOP: (state, shop) => {
      state.shop = shop
    },
  },

  actions: {
    // 登录
    Login({ commit }, userInfo) {
      const username = userInfo.username.trim()
      const password = userInfo.password
      const code = userInfo.code
      const uuid = userInfo.uuid
      return new Promise((resolve, reject) => {
        login(username, password, code, uuid).then(res => {
          setToken(res.token)
          commit('SET_TOKEN', res.token)
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },

    // 获取用户信息
    GetInfo({ commit, state }) {
      return new Promise((resolve, reject) => {
        getInfo().then(res => {
          const user = res.user
          const shop = res.shop
          const avatar = (user.avatar == "" || user.avatar == null) ? require("@/assets/images/profile.jpg") : process.env.VUE_APP_BASE_API + user.avatar;
          if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
            commit('SET_ROLES', res.roles)
            commit('SET_PERMISSIONS', res.permissions)
          } else {
            commit('SET_ROLES', ['ROLE_DEFAULT'])
          }
          commit('SET_ID', user.userId)
          commit('SET_NAME', user.userName)
          commit('SET_AVATAR', avatar)
          // 设置店铺
          commit('SET_SHOP', shop)
          resolve(res)
        }).catch(error => {
          reject(error)
        })
      })
    },

    // 退出系统
    LogOut({ commit, state }) {
      return new Promise((resolve, reject) => {
        logout(state.token).then(() => {
          commit('SET_TOKEN', '')
          commit('SET_ROLES', [])
          commit('SET_PERMISSIONS', [])
          // 设置店铺
          commit('SET_SHOP', [])
          removeToken()
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },

    // 前端 登出
    FedLogOut({ commit }) {
      return new Promise(resolve => {
        commit('SET_TOKEN', '')
        removeToken()
        resolve()
      })
    }
  }
}

export default user

getters.js
在这里插入图片描述

const getters = {
  sidebar: state => state.app.sidebar,
  size: state => state.app.size,
  device: state => state.app.device,
  dict: state => state.dict.dict,
  visitedViews: state => state.tagsView.visitedViews,
  cachedViews: state => state.tagsView.cachedViews,
  token: state => state.user.token,
  avatar: state => state.user.avatar,
  name: state => state.user.name,
  introduction: state => state.user.introduction,
  roles: state => state.user.roles,
  permissions: state => state.user.permissions,
  shop: state => state.user.shop, // 设置店铺
  permission_routes: state => state.permission.routes,
  topbarRouters:state => state.permission.topbarRouters,
  defaultRoutes:state => state.permission.defaultRoutes,
  sidebarRouters:state => state.permission.sidebarRouters,
}
export default getters

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1824516.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Zig标准库:最全数据结构深度解析(1)

最近新闻看到17岁中专女生拿下阿里全球数学竞赛第12名。咱们学习标准库中的数据结构是和学习数学是一脉相承的,结构体很多,也非常枯燥,但是不能全面解读过一遍,你很难写出合理的代码。所以,这一章节我们开始深度解析Zi…

HTML静态网页成品作业(HTML+CSS)—— 校园贷主题网页(2个页面)

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTMLCSS,未使用Javacsript代码,共有2个页面。 二、作品演示 三、代…

理解Python的元类

1.type()函数 type 函数是一个内置函数,用来获取一个对象的类型。它可以接受一个参数,返回这个参数的数据类型。type也可以用来创建类,type就是元类 x333 list["ab"] tuple (1, "a", True, 3.14) dict {name: Alice,…

驱动开发(四):Linux内核中断

驱动开发系列文章: 驱动开发(一):驱动代码的基本框架 驱动开发(二):创建字符设备驱动 驱动开发(三):内核层控制硬件层 驱动开发(四&#xf…

JDK17 你的下一个白月光

JDK版本升级的非常快,现在已经到JDK20了。JDK版本虽多,但应用最广泛的还得是JDK8,正所谓“他发任他发,我用Java8”。 但实际情况却不是这样,越来越多的java工程师拥抱 JDK17,于是了解了一下 JDK17新语法&a…

浅谈TARA在汽车网络安全中的关键角色

随着现代汽车技术的迅猛发展,网络安全成为汽车行业一个不可忽视的领域。为了应对日益复杂的网络威胁,ISO/SAE 21434标准和UN R155法规提供了系统化的网络安全管理框架。其中,TARA(威胁分析与风险评估)作为核心方法论&a…

MGRS坐标

一 概述 MGRS坐标系统,即军事格网参考系统,是北约(NATO)军事组织使用的标准坐标系统。它基于UTM(通用横向墨卡托)系统,并将每个UTM区域进一步划分为100km100km的小方块。这些方块通过两个相连的字母标识,其…

从GAN到WGAN(02/2)

文章目录 一、说明二、GAN中的问题2.1 难以实现纳什均衡(Nash equilibrium)2.2 低维度支撑2.3 梯度消失2.4 模式坍缩2.5 缺乏适当的评估指标 三、改进的GAN训练四、瓦瑟斯坦(Wasserstein)WGAN4.1 什么是 Wasserstein 距离?4.2 为什么 Wassers…

AI大模型应用落地:AI+任何行业都是王炸

AI大模型物流:顺丰案例分享: 顺丰集团作为物流行业的领军企业,如何通过新质生产力的注入,重塑科技驱动的物流服务。 “天网”航空资源和“地网”地面运输网络一直是顺丰的两大优势,而多年来,通过在技术方…

除了程序员,你又是谁呢?别说!保护自己能量最好的方式——早读(逆天打工人爬取热门微信文章解读)

你很困的时候,会不会遵循本心直接睡觉呢? 引言Python 代码第一篇 洞见 保护自己能量最好的方式第二篇 视频新闻结尾 引言 现在真的是越来越遵循本心了 昨天晚上10点多 觉得好困 但是又没有洗澡 然后就想着算了 躺一个 没想到一躺 早上6点了 起来速速洗刷…

Scrum Day盛大启幕【限时优惠】

关于 Scrum Day 智驭未来,敏捷先行 —— 2024中国Scrum大会启航 在全球数字化转型的浪潮中,敏捷已成为企业脱颖而出的关键。 Scrum中文网携手全球敏捷行业巨擘 —— Scrum.org 联袂呈现年度敏捷盛会 Scrum Day,将于今秋盛大启幕&#xff01…

通过MATLAB实现PID控制器,积分分离控制器以及滑模控制器

目录 1.课题概述 2.系统仿真结果 3.核心程序与模型 4.系统原理简介 5.完整工程文件 1.课题概述 通过MATLAB实现PID控制器,积分分离控制器以及滑模控制器。通过对比三个算法可知,采用滑模控制算法,其具有最快的收敛性能,较强的鲁棒性&…

普通LED显示屏与柔性LED显示屏如何选择?

在数字化时代的浪潮中,LED显示屏作为信息展示的重要媒介,其市场发展迅速,产品种类也日益丰富。面对普通LED显示屏与柔性LED显示屏两种选择,消费者和企业常常陷入纠结。那么,究竟该如何选择呢?让我们来深入探…

QUIC 和 TCP: 深入解析为什么 QUIC 更胜一筹

引言 在过去的三十年里,HTTP(超文本传输协议)一直是互联网的支柱。我们可以通过 HTTP 浏览网页、下载文件、流式传输电影等。这一协议随着时间的推移已经得到了重大改进。 HTTP 协议是一个应用层协议,它基于 TCP(传输…

手机IP地址距离多远会变:解析移动设备的网络定位奥秘

在移动互联网时代,手机IP地址扮演着至关重要的角色,它不仅是我们访问网络的基础,还常常与网络定位、地理位置服务等相关联。那么,手机IP地址在距离多远时会发生变化呢?手机IP地址距离多远会变?下面跟着虎观…

C# 中的日志记录技术详细解析与示例

文章目录 1. C# 日志记录的基本概念与重要性2. C# 中的日志记录主要方法使用 Console.WriteLine使用 System.Log* 类使用第三方日志库 3. 创建和配置日志记录器的基本步骤4. 不同情境下的日志记录应用示例示例 1:使用 Console.WriteLine示例 2:使用 Debu…

HTML静态网页成品作业(HTML+CSS+JS)——游戏天天酷跑网页(4个页面)

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTMLCSS,使用Javacsript代码实现图片切换轮播,共有4个页面。 二、…

【Ardiuno】使用ESP32单片机网络功能调用API接口(图文)

接着上文连通wifi后,我们通过使用HTTPClient库进行网络相关操作,这里我们通过http协议进行接口调用。 为了简化操作,小飞鱼这里使用了本地服务器上的文件作为接口,正常操作时会调用接口后,将服务器返回的数据进行解析…

AI办公自动化:批量在多个Word文档中插入对应图片

工作任务:文件夹中有多个word文档和word文档名称一致的图片,要把这些图片都插入到word文档中 在chatpgt中输入提示词: 你是一个Python编程专家,写一个Python脚本,具体步骤如下: 打开文件夹:F:…

php收银系统源码推荐

智慧新零售系统是一套线下线上一体化的收银系统。致力于给零售门店提供『多样化线下收银』、『ERP进销存』、『o2o小程序商城』、『精细化会员管理』、『丰富营销插件』等一体化行业解决方案! 一、多样化线下收银 1.聚合收款码 ①适用商户:小微门店&am…