vue+ElementUI后台管理系统

最新推荐文章于 2025-04-29 11:56:05 发布

小山羊~

最新推荐文章于 2025-04-29 11:56:05 发布

阅读量1.1k

点赞数

分类专栏： vue 文章标签： vue.js elementui 前端

本文链接：https://blog.youkuaiyun.com/qq_21747731/article/details/118968403

版权

本文介绍了一个基于Vue.js和ElementUI的后台管理系统，重点讨论了登录/退出功能，特别是如何处理跨域问题，使用token或cookie/session进行身份验证。详细讲述了路由导航守卫，包括在路由配置文件和组件模板中设置beforeRouteEnter和beforeRouteLeave钩子函数，以控制访问权限。同时提到了动态导航、权限概念，以及如何根据角色设置不同用户的权限。涉及到的工具和技术包括nprogress、vue-table-with-tree-grid、Vue-Quill-Editor和lodash。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、登录/退出功能

若前端与后台存在跨域问题，则使用token

否则，使用cookie/session方式

token:(本地 + vuex)

编程式导航，顾名思义，就是在业务逻辑代码中实现导航。

this.$router.push('/home');

3.3路由导航守卫（路由的钩子函数）控制访问权限

如果用户没有登录，但是直接通过URL访问特定页面，需要重新导航到登陆页面

// 挂载路由导航守卫
router.beforeEach((to, from, next) => {
  // to:将要访问的路径
  // from：代表从哪个路径跳转而来
  // next：是一个函数，表示放行
  //     next() 放行    next('/login')强制放行
  if (to.path =