vue-element-admin实战 | 第一篇: 移除mock接入后台微服务接口,搭建SpringCloud+Vue前后端分离的管理平台 一. 前言本篇基于 有来商城youlai-mall 微服务项目搭建的后台前端管理平台,技术选型Vue+element-ui实现…
1. mock接口信息 先看下vue-element-admin登录进入平台所需要的接口信息,如下图所示,是有两个关键接口 接口一:/user/login 登录认证获取token { "code": 20000, "data": { "token": "admin-token" } } 1. 2. 3. 4. 5. 6. 接口二:/user/info?token=admin-token 根据token获取用户信息 { "code"...
到这里就完成了vue-element-admin移除mock接入到后台的功能 四. 搭建管理前端 通过上面步骤,我们已成功改造vue-element-admin接入到后台接口,接下来我们以管理平台的用户管理功能为例讲述如何使用vue-element-admin搭建我们自己的管理平台。 1. 删除多余文件
到这里就完成了vue-element-admin移除mock接入到后台的功能 四. 搭建管理前端 通过上面步骤,我们已成功改造vue-element-admin接入到后台接口,接下来我们以管理平台的用户管理功能为例讲述如何使用vue-element-admin搭建我们自己的管理平台。 1. 删除多余文件
本篇基于 有来商城 youlai-mall 微服务项目,通过对vue-element-admin的权限菜单模块理解个性定制其后台接口,实现对vue-element-admin工程几乎不做改动的情况下,无缝接入后台接口实现动态权限菜单的加载。 在进行接下来的工作前,我们需要对原生的vue-element-admin项目改造,移除mock连通后台接口,具体可参考我这篇文章 vue...
1. 移除 mock 修改vue.config.js 文件 1. 首先将 before: require("./mock/mock-server.js") 注释掉 2. 添加一下内容 proxy: {// change xxx-api/login => mock/login// detail: https://cli.vuejs.org/config/#devserver-proxy[process.env.VUE_APP_BASE_API]: { ...
本篇基于 有来商城 youlai-mall 微服务项目,通过对vue-element-admin的权限菜单模块理解个性定制其后台接口,实现对vue-element-admin工程几乎不做改动的情况下,无缝接入后台接口实现动态权限菜单的加载。 在进行接下来的工作前,我们需要对原生的vue-element-admin项目改造,移除mock连通后台接口,具体可参考...
element-admin mock改成真实请求 之前使用 element-admin 模板 自带的有mock请求,想替换成后台真正的请求,发现一只请求的是本地的localhost ,按照按照文档上的做(我直接注释了after 这一行,并修改了 proxy中target的代理地址)发现没有效果,再后来多方查询发现自己理解错了,移除分两个部分,一个是 移除mock,另外一个...
这半年来一直在用vue写管理后台,目前后台已经有百来个页面,十几种权限,但维护成本依然很低,所以准备开源分享一下后台开发的经验和成果。目前的技术栈主要的采用vue+element+axios由webpack2打包。由于是个人项目,所以数据请求都是用了mockjs模拟。注意:在此项目基础上改造开发时请移除mock文件。
侧边栏的菜单,一开始可以用mock模拟数据 ,后期改为Webapi返回的动态数组 路由 和 侧边栏是组织起一个后台应用的关键骨架。 依据前面的学习,在路由 router文件夹下的 index.js 中,静态路由,比如登录页 { path: '/login', // 指定要跳转的路径,就是网站后缀 ...