简介: Vue3-admin-template 框架修改登录页面 一. 修改views/login/comp/LoginForm.vue文件里面的内容 const state = reactive({ ruleForm: { account: 'admin', password: '123456', }, loading: false, checkedPwd: false, redirect: undefined, rules: { account: [{ required: true, message: t('...
// 修改为你自己的后台地址,可能会产生跨域问题,百度有很多解决方案// 如果你后台是 spring 项目,可以直接在相应的 controller加 @CrossOrigin 注解即可exportfunctionlogin(data) {returnrequest({url:'http://localhost:8800/login',method:'post',data: data }) } 登陆后,token 存储到 cookie,以后发送请求会自...
1.下载并解压vue-admin-template-master 修改成自己项目的名字 2.修改名字后导入到WebStrom 打开下方Terminal输入npm install 等待下载完成 看到这个界面说明下载完成 3.继续从命令行输入npm run dev 4.直接跳转默认浏览器 5.改造登录&退出功能 5.1、vue.config.js 注释掉mock接口配置 配置代理转发请求到目标接口 //...
1.登录 登录界面如果不需要自定义的话,不需要过多的修改,从 界面 至 modules,再到 api 都已经设计好了; 此处 是表单验证成功后,调用 store/modules 中的 user.js 里边的login方法 handleLogin(){this.$refs.loginForm.validate(valid=>{if(valid){this.loading=truethis.$store.dispatch('user/login',this....
理解vue-admin-template模板,连接后端改造登陆功能 首先修改统一请求路径为我们自己的登陆接口,在.env.development文件中 # base api VUE_APP_BASE_API = 'http://localhost:8081/api/dsxs/company' 打开登陆页面,src/views/login/index.vue <template>
1. 修改router/index.js文件 去掉多余的路由,只留下这两个路由。/404、{ path: "*", redirect: "/404", hidden: true }都注释掉。 image.png 2. 修改store/modules/user.js文件 image.png import{adminMenus,signUserMenus}from"@/router/menus";constgetDefaultState=()=>{return{menus:"",// 存放...
这样基本上把后端接口类型写完,然后还需要做一些配置修改,如下图 将接口改成自己的就可以实现,然后记住修改全局的配置,需要重启前端项目。 总得来说,将登录接口改成自己的需要完成,两个接口,一个是登录接口获取token,第二个根据第一个接口获取到的token,从而获取用户信息,最后就是修改自己请求接口配置了。记住,接口...
这是一个极简的 vue admin 管理后台,基于vue-admin-template进行了细节改造,主要是把侧边导航改造为了顶部和侧边两个导航。 本项目默认开启了css:sourceMap和devtool('source-map'),便于在开发中调试,除非编译速度过慢,否则开发环境不建议修改。 IDE 编辑器建议使用VS Code,格式化时可以统一代码风格,配置项建议统一...
第七,修改菜单组件页面 前言 最近,有个业务需要快速开发一套后台管理系统,网上对比了很多,觉得vue-element-admin挺好用,功能强大,但是里面集成了很多实际业务用不到的东西,其基础版vue-element-template正好适合,在整合菜单权限开发,实现不同用户登录时展现不同的菜单出现了一点问题,百度找了很久无果,最后参照下面这位...
登录Rancher 更新服务 地址:http://192.168.2.244:8080 用户名:work 密码:work@123 页面模板 // 项目中 template.vue<template><!-- page-name:页面名称,如应用管理 app-mag --><c-breadcrumb:router-list="routerList"></c-breadcrumb>页面内容</template>importCBreadcrumbfrom'components/layout/breadcrumb'ex...