首页 > 其他分享 >store下的 moudles 下的 permssion.js文件 主要是对路由规则的生成进行解释

store下的 moudles 下的 permssion.js文件 主要是对路由规则的生成进行解释

时间:2023-12-27 14:36:35浏览次数:33  
标签:roles moudles accessedRoutes js meta permssion routes route 路由

import { asyncRoutes, constantRoutes } from '@/router'

/**
 * Use meta.role to determine if the current user has permission
 * @param roles
 * @param route
 */
function hasPermission(roles, route) {
  // 如果 route.meta 规则中有meta  meta中有roles选项
  if (route.meta && route.meta.roles) {
    // 看一下, ['editor']有没有在meta:{roles:['editor']}中
    // 如果在 就返回true 如果不在就返回 false
    return roles.some(role => route.meta.roles.includes(role))
  } else {
    // 如果meta中没有roles选项 返回true
    return true
  }
}

/**
 * Filter asynchronous routing tables by recursion
 * @param routes asyncRoutes
 * @param roles
 */

// routes 是所有的路由规则 roles是当前角色
export function filterAsyncRoutes(routes, roles) {
  const res = []

  // 遍历所有的动态路由规则  route是每一个规则
  routes.forEach(route => {
    // 把每一个规则使用 临时变量tmp存储
    const tmp = { ...route }
    // hasPermission(['editor'],{path,component,meta:{roles:['editor']}}):boolean
    if (hasPermission(roles, tmp)) {
      // 如果有children 就递归的计算
      if (tmp.children) {
        tmp.children = filterAsyncRoutes(tmp.children, roles)
      }
      res.push(tmp)
    }
  })

  return res
}

const state = {
  routes: [],
  addRoutes: []
}

const mutations = {
  SET_ROUTES: (state, routes) => {
    state.addRoutes = routes
    state.routes = constantRoutes.concat(routes)
  }
}

// const actions = {
//   // 计算生成需要权限访问的动态路由规则
//   generateRoutes({ commit }, roles) {
//     return new Promise(resolve => {
//       let accessedRoutes// 计算出来需要权限访问的路由规则
//       // 如果是admin用户 把所有的动态路由赋值给accessedRoutes
//       if (roles.includes('admin')) {
//         // 也就是说admin 可以访问所有的动态路由 不需要去计算可访问的动态路由
//         accessedRoutes = asyncRoutes || []
//       } else {
//         // 用户不是admin filterAsyncRoutes 就是去计算当前用户可以访问哪些动态路由
//         // asyncRoutes 所有路由 和当前角色
//         accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
//       }
//       commit('SET_ROUTES', accessedRoutes)
//       resolve(accessedRoutes)
//     })
//   }
// }
const actions = {
  // 计算生成需要权限访问的动态路由规则
  generateRoutes({ commit }, roles) {
    return new Promise(resolve => {
      let accessedRoutes// 计算出来需要权限访问的路由规则
      // 如果是admin用户 把所有的动态路由赋值给accessedRoutes
      // eslint-disable-next-line prefer-const
      accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
      commit('SET_ROUTES', accessedRoutes)
      resolve(accessedRoutes)
    })
  }
}
export default {
  namespaced: true,
  state,
  mutations,
  actions
}

标签:roles,moudles,accessedRoutes,js,meta,permssion,routes,route,路由
From: https://www.cnblogs.com/lin513/p/17930470.html

相关文章

  • js一道try...catch的面试题
    说到try...catch都觉得非常熟悉了,不就是用来捕捉代码块中的错误嘛,平时也用得比较多的。然而因为了解不够多,我的面试却栽在了一个简单的知识点上:try...catch只能捕捉到同步执行代码块中的错误。题目是:以下代码有错吗?如果有错,应该如何改正?try{setTimeout(()=>{thrown......
  • 关于autojs
    1、官方文档:http://doc.autoxjs.com/2、vscode的安装使用:https://blog.csdn.net/tfnmdmx/article/details/1239848083、vscode的智能提示:https://blog.csdn.net/zz00008888/article/details/133771057已实现的热更新方案:1、将gitlab可以设置为公开访问,通过http下载压缩包,解压......
  • jmeter的json提取器多个取值的取法&ForEach控制器对多取值变量进行循环调用
    1、jmeter的json提取器多个取值的取法userId有多个值 $.responseData.datas[*].userId-1代表取所有的值  2、ForEach控制器对多取值变量进行循环调用 --实现多取值变量进行循环调用${userId_matchNr} ---代表存储变量的长度  3、循环控制器--实现id自增 ......
  • 【力扣】-15. 三数之和|刷题打卡-JS
    给你一个整数数组 nums ,判断是否存在三元组 [nums[i],nums[j],nums[k]] 满足 i!=j、i!=k 且 j!=k ,同时还满足 nums[i]+nums[j]+nums[k]==0 。请你返回所有和为 0 且不重复的三元组。注意:答案中不可以包含重复的三元组。示例1:输入:nums=[-1,0,1,2,-1,-4......
  • Node.js+Express+Koa2开发接口学习笔记(三)
    数据库操作(创建和增删查)使用Navicat快速创建myblog数据库创建表使用navicat快速建表使用sql语句进行简单的查询--showtables;--显示该数据库中的所有表INSERTINTOusers(username,`password`,realname)VALUES('zhangsan','123','张三')INSERTINTOusers(......
  • Python+Selenium4自动化之JS属性
     应用场景在自动化中,能对JS代码进行增、删、改的话,可以帮助我们解决很多问题,如:修改<a>标签的target属性,让它不打开新的窗口(_blank),从而不用频繁使用switch_to进行窗口之间的切换。如:日期的输入框被锁定无法直接输入,需要点开日历控件后,从日历控件上点击日期,这时就可以删除......
  • P5333 [JSOI2019] 神经网络
    题面传送门本来以为\(m\)这么小是\(m\sumk_i\logk\)的NTT的,写完发现一点不用(首先我们发现,这样的图上面的一个哈密顿回路可以表示成原森林若干条链,每个点都在其中一条链上,且相邻两条链不在同一棵树上。先跑一个DP把\(f_{i,j}\)表示用\(j\)条链覆盖\(i\)的方案数......
  • 记录--工程化第一步这个package.json要真的搞明白才行
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助工程化最开始就是package.json开始的,很多人学了很多年也没搞清楚这个为什么这么神奇,其实有些字段是在特定场景才有效的,那每个属性的适用场景和作用是什么,又牵扯很多知识点,今天先解读一些常见的属性,关注我,后期在遇到......
  • html jquery from 表单提交 application/x-www-form-urlencoded 改成 json
    htmljqueryfrom表单提交$(form).ajaxSubmitapplication/x-www-form-urlencoded改成json<formclass="formform-horizontal"id="form-admin-add"><divclass="rowcl"><labelclass="form-labelcol-xs-4col-......
  • vs 使用 jsonschema
    使用jsonschema限制json配置文件内容vs配置文件中,添加\(schema,映射对应的json文件,此文件可以根据现有json文件通过工具生成基础的内容"\)schema":"http://127.0.0.1/webapibase.json",jsonschema文档https://json-schema.apifox.cn/工具https://hellosean1025.gith......