vue-admin-templete连接后台 + 更改权限

最新推荐文章于 2024-05-12 17:27:17 发布
最新推荐文章于 2024-05-12 17:27:17 发布
阅读量1.4k 收藏 6
点赞数 2
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/biancheng4/article/details/122135273
版权

1.关闭mock

在vue.config.js中注释如下内容

在这里插入图片描述

在main.js中注释如下

在这里插入图片描述

2.更改连接源

在config下的setting.config中将

在这里插入图片描述

原本为mock改为自己的后台地址就好了

3.后台传递

将mock文件下的controller中的user按照相同格式从后台往前台传输

前台mock传递数据

const accessTokens = {
  admin: 'admin-accessToken',
  editor: 'editor-accessToken',
  test: 'test-accessToken',
  sample: 'sample-accessToken',
  division: 'division-accessToken',
  applicant: 'applicant-accessToken',
}

module.exports = [
  {
    url: '/publicKey',
    type: 'post',
    response() {
      return {
        code: 200,
        msg: 'success',
        data: {
          mockServer: true,
          publicKey:
            'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDBT2vr+dhZElF73FJ6xiP181txKWUSNLPQQlid6DUJhGAOZblluafIdLmnUyKE8mMHhT3R+Ib3ssZcJku6Hn72yHYj/qPkCGFv0eFo7G+GJfDIUeDyalBN0QsuiE/XzPHJBuJDfRArOiWvH0BXOv5kpeXSXM8yTt5Na1jAYSiQ/wIDAQAB',
        },
      }
    },
  },
  {
    url: '/login',
    type: 'post',
    response(config) {
      const { username } = config.body
      const accessToken = accessTokens[username]
      if (!accessToken) {
        return {
          code: 500,
          msg: '帐户或密码不正确。',
        }
      }
      return {
        code: 200,
        msg: 'success',
        data: { accessToken },
      }
    },
  },
  {
    url: '/register',
    type: 'post',
    response() {
      return {
        code: 200,
        msg: '模拟注册成功',
      }
    },
  },
  {
    url: '/userInfo',
    type: 'post',
    response(config) {
      const { accessToken } = config.body
      let permissions = ['admin']
      let username = 'admin'
      if ('admin-accessToken' === accessToken) {
        permissions = ['admin']
        username = 'admin'
      }
      if ('editor-accessToken' === accessToken) {
        permissions = ['editor']
        username = 'editor'
      }
      if ('test-accessToken' === accessToken) {
        permissions = ['test']
        username = 'test'
      }
      if ('sample-accessToken' === accessToken) {
        permissions = ['sample']
        username = 'sample'
      }
      if ('division-accessToken' === accessToken) {
        permissions = ['division']
        username = 'division'
      }
      if ('applicant-accessToken' === accessToken) {
        permissions = ['applicant']
        username = 'applicant'
      }

      return {
        code: 200,
        msg: 'success',
        data: {
          permissions,
          username,
          'avatar|1': [
            'https://i.gtimg.cn/club/item/face/img/2/15922_100.gif',
            'https://i.gtimg.cn/club/item/face/img/8/15918_100.gif',
          ],
        },
      }
    },
  },
  {
    url: '/logout',
    type: 'post',
    response() {
      return {
        code: 200,
        msg: 'success',
      }
    },
  },
]

后台Java传递数据

**
 * <p>
 *     前端控制器
 * </p>
 *
 *
 * @author 又菜又爱玩
 * @since 2021-12-21
 */
@Api(tags = "用户信息类")
@RestController
public class MmLoginuserController {
    @Autowired
    private MmLoginuserService mmLoginuserService;

    @ApiOperation("用户登录")
    @PostMapping(value = "/login")
    public CommonResponse Login(){
        return CommonResponse.ok().data("data","admin-accessToken");
    }
    @ApiOperation("用户信息")
    @PostMapping("/userInfo")
    public CommonResponse info(){
        ArrayList list = new ArrayList();
        list.add("admin");
        return CommonResponse.ok()
                .data("permissions",list)
                .data("username","admin")
                .data("avatar","https://img0.baidu.com/it/u=3623309039,2407011632&fm=26&fmt=auto");
    }


    @ApiOperation("用户退出")
    @GetMapping("/logout")
    public CommonResponse logout(){
        return CommonResponse.ok().data("token", "admin");
    }


    @ApiOperation("密钥")
    @PostMapping("/publicKey")
    public CommonResponse Key(){
        return CommonResponse.ok().data("mockServer", false)
                .data("publicKey", "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDBT2vr+dhZElF73FJ6xiP181txKWUSNLPQQlid6DUJhGAOZblluafIdLmnUyKE8mMHhT3R+Ib3ssZcJku6Hn72yHYj/qPkCGFv0eFo7G+GJfDIUeDyalBN0QsuiE/XzPHJBuJDfRArOiWvH0BXOv5kpeXSXM8yTt5Na1jAYSiQ/wIDAQAB");
    }


}

4.修改store/modules下的user.js

在这里插入图片描述

在这个地方，如果传递格式不匹配data就是空值，将自己后台传递的数据拉出来，像我传过来的数据都在data的集合而不是data,这里就需要修改。在这里插入图片描述

在这里插入图片描述

这里发现一个数组检验，也就是permissions是必须是数组的，我的相应后台

在这里插入图片描述

退出可以直接将清除token的方法拉上来就可以了

在这里插入图片描述

这时你的登录，登出代码都在后端了。

5、权限管理

vue-admin-templete在config文件夹下的permission中权限所需要的代码已经写好了我们只需要在路由中进行权限配置就好了。在这里插入图片描述

我的路由代码如下
/**
 * @copyright chuzhixin 1204505056@qq.com
 * @description router全局配置，如有必要可分文件抽离
 */

import Vue from 'vue'
import VueRouter from 'vue-router'
import Layout from '@/layouts'
import EmptyLayout from '@/layouts/EmptyLayout'
import { publicPath, routerMode } from '@/config'

Vue.use(VueRouter)

export const constantRoutes = [
  {
    path: '/login',
    component: () => import('@/views/login/index'),
    hidden: true,
  },
  {
    path: '/register',
    component: () => import('@/views/register/index'),
    hidden: true,
  },
  {
    path: '/401',
    name: '401',
    component: () => import('@/views/401'),
    hidden: true,
  },
  {
    path: '/404',
    name: '404',
    component: () => import('@/views/404'),
    hidden: true,
  },
]

/*当settings.js里authentication配置的是intelligence时，views引入交给前端配置*/
export const asyncRoutes = [
  {
    path: '/',
    component: Layout,
    redirect: '/index',
    children: [
      {
        path: '/index',
        name: 'Index',
        component: () => import('@/views/index/index'),
        meta: {
          title: '首页',
          icon: 'home',
          affix: true,
          noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/choseProgram',
    component: Layout,
    children: [
      {
        path: '/choseProgram',
        name: 'choseProgram',
        component: () => import('@/views/choseProgram'),
        meta: {
          title: '选择项目',
          icon: 'home',
          permissions: ['admin', 'applicant'],

          // affix: true,
          // noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/approver',
    component: Layout,
    name: 'Vab',
    alwaysShow: true,
    meta: {
      title: '审批',
      icon: 'box-open',
      permissions: ['admin', 'division', 'sample', 'test', 'editor'],
    },
    children: [
      {
        path: '/approver',
        name: 'approver',
        component: () => import('@/views/approver'),
        meta: {
          title: '审批',
          icon: 'home',
          permissions: ['admin'],

          // affix: true,
          // noKeepAlive: true,
        },
      },

      {
        path: '/manager',
        component: () => import('@/views/approver/manager/index'),
        redirect: 'noRedirect',
        alwaysShow: true,
        meta: {
          title: '主管审批',
          icon: 'box-open',
          permissions: ['admin', 'division'],
        },

        children: [
          {
            path: 'y_approval',
            name: 'y_approval',
            component: () =>
              import('@/views/approver/manager/y_approval/index'),
            meta: {
              title: '已审批',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'n_approval',
            name: 'n_approval',
            component: () =>
              import('@/views/approver/manager/n_approval/index'),
            meta: {
              title: '未审批',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'turn_down',
            name: 'turn_down',
            component: () => import('@/views/approver/manager/turn_down/index'),
            meta: {
              title: '已驳回',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'm_info',
            name: 'm_info',
            component: () => import('@/views/approver/manager/m_info/index'),
            meta: {
              title: '详情',

              //affix: false,
              //noKeepAlive: false,
            },
            hidden: true,
          },
        ],
      },

      {
        path: '/checkout',
        component: () => import('@/views/approver//checkout/index'),
        redirect: 'noRedirect',
        alwaysShow: true,
        meta: {
          title: '校验员审批',
          icon: 'box-open',
          permissions: ['admin', 'editor'],
        },
        children: [
          {
            path: 'y_pass',
            name: 'y_pass',
            component: () => import('@/views/approver/checkout/y_pass/index'),
            meta: {
              title: '已通过',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'n_check',
            name: 'n_check',
            component: () => import('@/views/approver/checkout/n_check/index'),
            meta: {
              title: '未审批',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'turn_down',
            name: 'turn_down',
            component: () => import('@/views/approver/checkout/turn_down'),
            meta: {
              title: '已驳回',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'c_info',
            name: 'c_info',
            component: () => import('@/views/approver/checkout/c_info/index'),
            meta: {
              title: '详情',

              //affix: false,
              //noKeepAlive: false,
            },
            hidden: true,
          },
        ],
      },

      {
        path: '/receiver',
        component: () => import('@/views/approver/receiver/index'),
        redirect: 'noRedirect',
        alwaysShow: true,
        meta: {
          title: '接样人审批',
          icon: 'box-open',
          permissions: ['admin', 'sample'],
        },

        children: [
          {
            path: 'y_pass1',
            name: 'y_pass1',
            component: () => import('@/views/approver/receiver/y_pass1/index'),
            meta: {
              title: '已通过',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'n_check1',
            name: 'n_check1',
            component: () => import('@/views/approver/receiver/n_check1/index'),
            meta: {
              title: '未审批',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'turn_down1',
            name: 'turn_down1',
            component: () => import('@/views/approver/receiver/turn_down1'),
            meta: {
              title: '已驳回',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'c_info1',
            name: 'c_info1',
            component: () => import('@/views/approver/receiver/c_info1/index'),
            meta: {
              title: '详情',

              //affix: false,
              //noKeepAlive: false,
            },
            hidden: true,
          },
        ],
      },

      {
        path: '/monitor',
        component: () => import('@/views/approver//monitor/index'),
        redirect: 'noRedirect',
        alwaysShow: true,

        meta: {
          title: '检测员审批',
          icon: 'box-open',
          permissions: ['admin', 'test'],
        },

        children: [
          {
            path: 'indata',
            name: 'indata',
            component: () => import('@/views/approver/monitor/indata/index'),
            meta: {
              title: '录入数据',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'y_pass',
            name: 'y_pass',
            component: () => import('@/views/approver/checkout/y_pass/index'),
            meta: {
              title: '已通过',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'n_check',
            name: 'n_check',
            component: () => import('@/views/approver/checkout/n_check/index'),
            meta: {
              title: '未审批',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'turn_down',
            name: 'turn_down',
            component: () => import('@/views/approver/checkout/turn_down'),
            meta: {
              title: '已驳回',
              icon: 'home',
              // affix: true,
              // noKeepAlive: true,
            },
          },
          {
            path: 'c_info',
            name: 'c_info',
            component: () => import('@/views/approver/checkout/c_info/index'),
            meta: {
              title: '详情',

              //affix: false,
              //noKeepAlive: false,
            },
            hidden: true,
          },
          {
            path: 'detail',
            name: 'detail',
            component: () => import('@/views/approver/monitor/detail/index'),
            meta: {
              title: '详情',

              //affix: false,
              //noKeepAlive: false,
            },
            hidden: true,
          },
        ],
      },
    ],
  },
  {
    path: '/distribution',
    component: Layout,
    children: [
      {
        path: '/distribution',
        name: 'distribution',
        component: () => import('@/views/distribution'),
        meta: {
          title: '技术分配',
          icon: 'home',
          permissions: ['admin', 'sample'],
          // affix: true,
          // noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/management',
    name: 'management',
    component: Layout,
    alwaysShow: true,

    meta: { title: '管理', icon: 'box-open', permissions: ['admin'] },

    children: [
      {
        path: 'M_user',
        name: 'M_user',
        component: () => import('@/views/approver/management/M_user/index'),
        meta: {
          title: '用户管理',
          icon: 'home',
          // affix: true,
          // noKeepAlive: true,
        },
      },
      {
        path: 'serve',
        name: 'serve',
        component: () => import('@/views/approver/management/serve/index'),
        meta: {
          title: '添加用户',

          //affix: false,
          //noKeepAlive: false,
        },
        hidden: true,
      },
      {
        path: 'N_user',
        name: 'N_user',
        component: () => import('@/views/approver/management/N_user/index'),
        meta: {
          title: '添加用户',

          //affix: false,
          //noKeepAlive: false,
        },
        hidden: true,
      },
      {
        path: 'pass',
        name: 'pass',
        component: () => import('@/views/approver/management/T_user/index'),
        meta: {
          title: '条目管理',
          icon: 'home',
          // affix: true,
          // noKeepAlive: true,
        },
      },
      {
        path: 'remember',
        name: 'remember',
        component: () => import('@/views/approver/management/B_user/index'),
        meta: {
          title: '部门管理',
          icon: 'home',
          // affix: true,
          // noKeepAlive: true,
        },
      },
      {
        path: '/result/detail',
        name: 'detail',
        hidden: true,
        component: () => import('@/views/result/detail'),
        meta: {
          title: '详情',
          icon: 'home',
          hidden: true,
          // affix: true,
          // noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/result',
    component: Layout,
    children: [
      {
        path: '/result',
        name: 'result',
        component: () => import('@/views/result/index'),
        meta: {
          title: '结果',
          icon: 'home',
          // affix: true,
          // noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/print',
    component: Layout,
    children: [
      {
        path: '/print',
        name: 'print',
        component: () => import('@/views/print'),
        meta: {
          title: '打印',
          icon: 'home',
          // affix: true,
          // noKeepAlive: true,
        },
      },
    ],
  },

  {
    path: '*',
    redirect: '/404',
    hidden: true,
  },
]

const router = new VueRouter({
  base: routerMode === 'history' ? publicPath : '',
  mode: routerMode,
  scrollBehavior: () => ({
    y: 0,
  }),
  routes: constantRoutes,
})
//注释的地方是允许路由重复点击，如果你觉得框架路由跳转规范太过严格可选择放开
/* const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location, onResolve, onReject) {
  if (onResolve || onReject)
    return originalPush.call(this, location, onResolve, onReject);
  return originalPush.call(this, location).catch((err) => err);
}; */

export function resetRouter() {
  router.matcher = new VueRouter({
    base: routerMode === 'history' ? publicPath : '',
    mode: routerMode,
    scrollBehavior: () => ({
      y: 0,
    }),
    routes: constantRoutes,
  }).matcher
}

export default router

当我使用smaple权限进入时

在这里插入图片描述

这些都是应该从用户表中读权限的，为了演示，就先这样写咯

在这里插入图片描述
在这里插入图片描述

再改成admin看下效果

在这里插入图片描述

又菜又爱玩呜呜呜~
关注
  • 2
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vue-element-admin-template 權限控制整理
software20121216的博客
01-10 1750
vue-element-admin是個強大的管理後台框架 https://github.com/PanJiaChen/vue-element-admin/tree/master/src/directive 經過了一些琢磨，終於知道vue-element-admin-template如何增加權限控制 首先，先把邏輯關係理清楚： 登錄後通過token獲取用戶對應的角色rol...
管理系统系列--vue-antd-admin基于vue-cli4+vuex+ant-design-vue开发的后台管.zip
02-25
【标题】"管理系统系列--vue-antd-admin基于vue-cli4+vuex+ant-design-vue开发的后台管理框架"揭示了这是一个使用特定技术栈构建的后台管理系统。它主要基于Vue.js，利用Vue CLI 4（Vue.js的命令行工具）进行快速...
vue-admin-template模板加入权限管理
weixin_49444845的博客
11-10 1447
vue-admin-template模板加入权限管理
2024年前端最全vue-admin-template 动态路由的实现（方式二 推荐），2024年最新腾讯的面试难吗
最新发布
2401_84616292的博客
05-12 983
在layout/components/sidebar/index.vue中。return reject(‘验证失败，请重新登录’)// 动态路由 增加permission_routes。添加roles: [] 保存权限列表 ，添加内容如下。作为window对象属性的文档元素。//添加permission。//添加permission。
Vue实现角色权限动态路由详细教程，在vue-admin-template基础上修改，附免费完整项目代码
coderYYY的博客
11-27 5920
Vue实现角色权限动态路由详细教程，在vue-admin-template基础上修改，附免费完整项目代码，有详细注释
Vue-Element-Template添加路由权限控制
rookieSquads的博客
09-17 1091
之前没有相关的开发经验，研究了一下下，可以直接去看Vue-Element-Admin的源码，路由问题可以看Vue-Element-Admin官方文档和Vue官方文档，很详细。下面是操作修改步骤： 将Vue-Element-Admin中的src/store/modules/permission.js复制到对应位置。 在src/store/getters.js 中添加permission_routes: state => state.permission.routes, 添加后会是下面这样： cons
vue-element-admin mock替换为服务器接口+ 请求头的设置
wh4834的博客
01-06 1753
vue-element-admin mock替换为服务器接口+ 请求头的设置 自学路上遇到的头痛的问题，写下来自己做个备忘，也希望帮助到初学者的你们。比心~
毕业设计项目-个人博客。前端基于Vue，Element-UI和Vue-Element-Admin实现，后台采用SpringBoot+MybatisPlus+Rd
07-09
Vue-Element-Admin则是一个基于Vue.js和Element-UI的后台管理系统模板，它包含了一套完整的管理端页面结构和基础功能，如登录、权限控制、多语言支持等，大大简化了前端开发的工作量。在本项目中，Vue-Element-Admin...
vue-admin-java：Spring启动+ mybatis + vue + element-ui实现后台管理API接口https：lmxdawn.github.iovue-admin-java
01-29
前言 ...项目JAVA前端地址： ...权限管理 401/404错误页面 动态面包屑 动态侧边栏 广告管理 在线演示 （建议使用最新版Chrome浏览器） 捐 鼓励鼓励鼓励，重要的事情说三遍 执照 版权所有（c）2018 lmxdawn
tp6-vue-admin:基于thinkphp6+vue2.6+element2.13 前后端分离落地解决方案
05-02
#注意1：vue-admin 中接口请求规则和动态路由，是对应tp6 中的接口规则和权限规则，需同时安装tp6和vue-admin 才能运行项目 #注意2：env 环境配置文件VUE_APP_BASE_API 接口地址，生产环境 或开发环境，需改变自己...
vue-admin-template:后台管理系统 vue+vue-cli+webpack+boostrap
05-14
"vue-admin-template" 是基于Vue.js、Vue CLI、Webpack和Bootstrap构建的一个后台管理系统模板。这个模板提供了一个起点，开发者可以在此基础上快速搭建功能完备的管理后台。 **Vue.js** Vue.js的核心特性包括声明...
修改 vue-admin-template mock数据为请求本地接口
cyt
08-02 6497
1、后端接口 登录接口 此处需要返回的是用户信息以及登录后的token ， 后端配置： port : 8001 路径：/api @GetMapping("/user/info") public ResultVO<HashMap> getInfo(String token) { log.info("get user info : " + token); String username = jwtConfig.getUsernameFromTo
使用vue-admin-template 进行增删查改
zyq854296521的博客
09-23 990
vue-admin-template vue element-ui 增删改查
手把手教你搞定权限管理，结合Vue实现菜单的动态权限控制！
weixin_70134200的博客
05-29 5433
手把手教你玩转权限控制，极致讲解，看懂这篇文章，我不信你还搞不懂权限控制以及菜单的动态切换
vue 不同用户登录系统拥有不同查看菜单导航的权限
m0_58017645的博客
07-15 4391
业务需求： 不同的登录用户进入系统后可以查看不同的菜单权限 比如：admin用户进入系统有四个权限：预报产品、预警产品、防灾减灾、系统管理，如下图： 而aaaa用户进入系统只有三个查看权限：预报产品、预警产品、系统管理，如下图： 具体实现： 1.postman提供的接口数据形式如下。当然期间我也参考了其他的项目，在别的项目中是单独写了一个接口，在这个项目中是把该用户所拥有的权限直接和登录接口写一起了。 2.简要介绍下项目的结构情况，导航栏部分我写在了header.vue里，用户登..
vue+elementUI+admin左侧菜单权限、动态路由
RYNTina的博客
04-02 2827
** vue+elementUI+admin左侧菜单权限 ** 1.登陆 在login文件下的index.vue（接口在store文件下modules/user.js） （⚠️注意：登陆页面如果接口成功但进不去页面则需要看一下store/modules/pemission.js的 getUserPowers方法，看这里的返回值是不是正确的 ） 2.获取用户信息 根据getInfo接口后台返回的信...
Django+vue3权限菜单rabc设计和动态路由
第九系艾文
07-02 1685
最重要的menu表已经设计完成，那么接下来就更简单了，还需要一个获取所有路由的方法，当添加权限的时候，可以方便的选择相应的路由权限。权限控制的话，可以基于Django的permission进行控制，并通过访问api的URL操作。因此，需要对menu表进行设计，由于涉及到了前端vue路由，因此，menu模型字段比较多，如下。前端是基于pure-admin二次开发的， 省去了前端开发，直接上手。本次是基于Django和vue实现。服务器设计及部分代码。
【springboot+vue项目（三）】后台管理系统模板vue-admin-template 的使用
shanglin1122的博客
06-28 3325
├── build/ # 构建脚本├── mock/ # 模拟数据├── public/ # 静态资源│ ├── favicon.ico # 网站图标│ └── index.html # 入口页面├── src/ # 项目源码│ ├── api/ # API 请求封装│ ├── assets/ # 静态资源│ ├── components/ # 公共组件│ ├── directive/ # 自定义指令│ ├── filters/ # 过滤器│ ├── icons/ # 图标。
vue-element-admin权限部分更改
哆啦A梦的百宝袋的博客
05-31 981
使用文档提供的方法和权限调用逻辑，根据项目的后台数据进行适配性修改。本身vue-element-admin配置的权限逻辑已经很完整清晰了，仅需要我们进行简单的适配就可以了。 逻辑修改 现在路由层面权限的控制代码都在 @/permission.js 中，如果想修改逻辑，直接在适当的判断逻辑中 next() 释放钩子即可。想要对项目的逻辑权限进行适应性修改就要先去梳理清楚他们提供的底层逻辑，基本上方法和逻辑的调用就是一环套一环。这里利用动态路由添加进行倒推。我们从完整项目demo中获取将所需要的权限部分进行引
vue-element-admin 对接django后台
08-17
总结起来，对接Vue-element-admin和Django后台，需要根据Vue-element-admin的组件和路由规则，在Django中进行相应的配置和编码，实现前后端的数据交互和权限控制。通过以上步骤，可以构建一个完整的Vue-element-...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值