Vue-element-admin 添加单独无菜单页面

正常页面都是在框架内构建页面,如果不想希望有导航等元素,如何操作,思路,login 不就是这样的页面吗

添加页面

src\views 创建 datav/index.vue

<template>
  <div id="app">
    <el-link type="primary" :underline="false" @click="handLogin">
      <span class="text-xs">Login</span>
      <el-icon class="text-xs">
        <arrow-right />
      </el-icon>
    </el-link>
  </div>
</template>

<script setup lang="ts">
import router from "@/router";

function handLogin() {
  router.push({ path: "/login" });
}
</script>

<style scoped lang="scss">
.text-xs {
  font-size: 60px;
}
</style>

router\index.ts

  {
    path: "/login",
    component: () => import("@/views/datav/index.vue"),  //login 改为 datav
    meta: { hidden: true },
  },

http://localhost:3000/#/login
此时可以实现直接预览

路由

添加单独的路由,这时候再打开会跳至登录而
http://localhost:3000/#/login?redirect=/datav

  {
    path: "/login",
    component: () => import("@/views/login/index.vue"),
    meta: { hidden: true },
  },
  //添加单独的路由。
  {
    path: "/datav",
    component: () => import("@/views/datav/index.vue"),
    meta: { hidden: true },
  },

权限配置

查找login?redirect= 找到对应的而面 plugins\permission.ts

  // 白名单路由
  const whiteList = ["/login"];

再次预览 http://localhost:3000/#/login
image

posted @ 2025-08-21 14:18  VipSoft  阅读(12)  评论(0)    收藏  举报