vue系统管理的左侧菜单，部分菜单需要登录内部账户才能进入

最新推荐文章于 2023-03-04 16:02:37 发布

sunyin.liu

最新推荐文章于 2023-03-04 16:02:37 发布

阅读量451

点赞数

分类专栏： Vuejs 文章标签：前端

本文链接：https://blog.csdn.net/weixin_42066070/article/details/124746877

版权

Vuejs 专栏收录该内容

70 篇文章 25 订阅 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了在Vue系统中如何实现部分左侧菜单需登录后才能访问的功能。通过记录用户信息、设置路由守卫以及在登录页根据参数跳转，确保用户在登录后能直接进入原先点击的页面。

摘要由CSDN通过智能技术生成

需求分析：点击左侧的菜单，弹出提示请登录账户，才能办理业务，然后直接进入到用户的登录页面，登录页面后不用先进首页，而是直接进入到点击的页面。

代码实现：

1、登录的时候记录用户的信息，比如用户名

2、路由守卫

3、跳转到登录页面的时候，根据参数跳转到点击的页面

实现1步骤的代码

// 用户密码登录
    pwdLogin() {
      this.$refs["pwdLoginForm"].validate((valid) => {
        //校验通过
        if (valid) {
          /*  let pathName =
            (this.$route.query && this.$route.query.pathName) || "/homePage";
          console.log(pathName);
          this.$router.replace({ path: pathName }); */

了解本专栏