Vue3.2后台管理系统

本视频是一套完整的Vue3.2后台管理系统实战教程，涵盖项目初始化、代码规范、ElementPlus集成及登录鉴权等核心功能开发。

UP主: 混吃等死的咸鱼仔 · 时长: 3h28m · 🔗 B站原视频

标签: Vue3.2 · 前端开发 · ElementPlus · 后台管理系统 · JavaScript

到了登录成功之后返回的数据这里有一个token 我需要把这个token存在vv差中和locos座椅中那我们怎么做呢我们找到store 因为我们要使用models 把这里的其他几个给删掉在这里创建一个文件夹 models del创建一个app.js 那么里面就是export default一个对象 name space为处也就是state mutations 还有action 那里面是什么东西呢因为我们要存token嘛肯定有个token 那这个token呢我们周肯定要存在local中我们肯定既然存了我们肯定要先取所以就是local storage.get item token 那如果取不到呢那它就是一个空字符串 mutations就是set token state 外界传入的token 那就是state的token等于token 那既然这里都接收到token 所以就需要存一份local switch.set item token token ok那么这个token从哪里来我们数据在哪里我们数据在登录页面的这里点击登录那我们不如直接放在actions里面统一一下给它注释掉这里呢给它注释把这里接口复制一下图示拿到app.js里来那么这里就是要执行一个登录操作所以就是logo in 那这里有个logo in 以及这里有个login 可能会出难免冲产生冲突所以给它设置个别名 s log in api 那么这里面就是commit接收一个用户信息有the inf 接下来呢就是复制一下return 发起请求 new promise resolve 和reject 他这里给我导入了两个东西我并不需要给它删掉那么发起请求就是loan api 把用户信息传入过去那么也就是点sn 2 result 那么有失败就开点catch reject ok那我们继续这里成功的时候我们要commit调用这个mutation里的set token给他拿过来把ios里的token给他传过去那么如果成功之后呢我们要跳到首页所以我们需要导入路由 import路由r o u t e r from 从哪里来呢啊哦有t2 也就是他拿过来点ie pl ac到我们的首页 ok这样就配置完成然后接着在index.js中导入这个app 点js app from.com d models 加了app给他扔进来那么在登录的时候就是触发这个actions 我们怎么做呢找到登录我们要使用vx 所以就是 import use store使用brown有一差那么要定义一下 const store等于use store执行那么就是 store.dispatch 拿到app app下的找一下log in 然后我们要传递值那么是哪些呢也就是form.value 在这里form.value ok我们现在来试一下看有没有执行我们在这里打印一下好了 console.log 2 保存刷新登录ok他已经跳转到首页然后以及内容已经拿到了那我先将它保存为一个视频