路由不匹配问题

This commit is contained in:
zhang zhuo 2025-06-12 17:41:27 +08:00
parent 6c8d57a4da
commit d83529deb4
6 changed files with 139 additions and 42 deletions

View File

@ -267,11 +267,6 @@ onLayoutResize();
window.addEventListener('resize', onLayoutResize);
showThis()
console.log(store.state.keepAlive.keepLiveRoute)
console.log(route.fullPath)
console.log(store.state.keepAlive.routeShow)
watch(route, () => {
showThis()
})

View File

@ -12,16 +12,6 @@ import {beforeEach, afterEach} from '@/utils/route';
//系统路由
const routes = sRouter
//系统特殊路由
const routes_404 = {
path: "/:pathMatch(.*)*",
hidden: true,
component: () => import('@/layout/404'),
}
let routes_404_r = () => {
}
const router = createRouter({
history: createWebHashHistory(),
routes: routes
@ -31,7 +21,7 @@ const router = createRouter({
document.title = config.APP_NAME
//判断是否已加载过动态/静态路由
var isGetRouter = false;
let isGetRouter = false;
router.beforeEach(async (to, from, next) => {
NProgress.start()
@ -42,8 +32,6 @@ router.beforeEach(async (to, from, next) => {
if (to.path === "/login") {
//删除路由(替换当前layout路由)
router.addRoute(routes[0])
//删除路由(404)
routes_404_r()
isGetRouter = false;
next();
return false;
@ -55,9 +43,7 @@ router.beforeEach(async (to, from, next) => {
}
if (!token) {
next({
path: '/login'
});
next(`/login?redirect=${to.fullPath}`);
return false;
}
@ -88,8 +74,7 @@ router.beforeEach(async (to, from, next) => {
menuRouter.forEach(item => {
router.addRoute("layout", item)
})
routes_404_r = router.addRoute(routes_404)
if (to.matched.length == 0) {
if (to.matched.length != 0) {
router.push(to.fullPath);
}
isGetRouter = true;
@ -99,7 +84,7 @@ router.beforeEach(async (to, from, next) => {
});
router.afterEach((to, from) => {
afterEach(to)
// afterEach(to)
NProgress.done()
});

View File

@ -2,19 +2,27 @@
import {RouteRecordRaw} from "vue-router";
const routes: RouteRecordRaw[] = [
{
name: "layout",
path: "/",
component: () => import('@/layout'),
redirect: '/dashboard',
children: []
},
{
path: "/login",
component: () => import('@/views/system/login'),
meta: {
title: "登录"
}
},
{
path: "/:pathMatch(.*)*",
name: "notFound",
component: () => import('@/layout/404'),
meta: {
hidden: true
}
},
{
name: "layout",
path: "/",
component: () => import('@/layout'),
redirect: '/dashboard',
children: []
}
]
export default routes;

View File

@ -2,9 +2,9 @@ import store from '@/store'
import {nextTick} from 'vue'
import {RouteLocationNormalized, RouteLocationNormalizedLoaded} from "vue-router";
import tools from "@/utils/tools";
import {h} from 'vue'
const modules: Record<string, () => Promise<any>> = import.meta.glob('@/views/**/*.vue')
const notFound = () => import('/src/layout/404.vue')
export function beforeEach(to: RouteLocationNormalized, from: RouteLocationNormalizedLoaded) {
const piMain = document.querySelector('#pi-main');
@ -56,19 +56,12 @@ export function filterAsyncRouter(routerMap) {
}
export function loadComponent(component: string) {
// 如果路径为空,直接返回一个空的组件
if (component === '') {
return
}
// 构建可能的路径
const fullPath = `/src/views/${component}.vue`
const fullPathWithIndex = `/src/views/${component}/index.vue`
// 先尝试直接路径,再尝试添加/index的路径
const module = modules[fullPath] || modules[fullPathWithIndex]
if (!module) {
return
}
return module
return module || notFound
}
//路由扁平化

114
src/utils/validate.ts Normal file
View File

@ -0,0 +1,114 @@
/**
*
* @param {string} pattern
* @param {string} path
* @returns {Boolean}
*/
export function isPathMatch(pattern, path) {
const regexPattern = pattern.replace(/\//g, '\\/').replace(/\*\*/g, '.*').replace(/\*/g, '[^\\/]*')
const regex = new RegExp(`^${regexPattern}$`)
return regex.test(path)
}
/**
* value字符串是否为空
* @param {string} value
* @returns {Boolean}
*/
export function isEmpty(value) {
if (value == null || value == "" || value == undefined || value == "undefined") {
return true
}
return false
}
/**
* url是否是http或https
* @param {string} url
* @returns {Boolean}
*/
export function isHttp(url) {
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
}
/**
* path是否为外链
* @param {string} path
* @returns {Boolean}
*/
export function isExternal(path) {
return /^(https?:|mailto:|tel:)/.test(path)
}
/**
* @param {string} str
* @returns {Boolean}
*/
export function validUsername(str) {
const valid_map = ['admin', 'editor']
return valid_map.indexOf(str.trim()) >= 0
}
/**
* @param {string} url
* @returns {Boolean}
*/
export function validURL(url) {
const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
return reg.test(url)
}
/**
* @param {string} str
* @returns {Boolean}
*/
export function validLowerCase(str) {
const reg = /^[a-z]+$/
return reg.test(str)
}
/**
* @param {string} str
* @returns {Boolean}
*/
export function validUpperCase(str) {
const reg = /^[A-Z]+$/
return reg.test(str)
}
/**
* @param {string} str
* @returns {Boolean}
*/
export function validAlphabets(str) {
const reg = /^[A-Za-z]+$/
return reg.test(str)
}
/**
* @param {string} email
* @returns {Boolean}
*/
export function validEmail(email) {
const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
return reg.test(email)
}
/**
* @param {string} str
* @returns {Boolean}
*/
export function isString(str) {
return typeof str === 'string' || str instanceof String
}
/**
* @param {Array} arg
* @returns {Boolean}
*/
export function isArray(arg) {
if (typeof Array.isArray === 'undefined') {
return Object.prototype.toString.call(arg) === '[object Array]'
}
return Array.isArray(arg)
}

View File

@ -1,6 +1,6 @@
<template>
<div>
<el-input v-model="form" placeholder="111"/>
<el-input v-model="form" placeholder=""/>
<el-button plain @click="showClick">点我</el-button>
<pi-dialog v-model="show" ref="dialog"></pi-dialog>
</div>
@ -8,7 +8,9 @@
<script setup>
import {getCurrentInstance, ref} from "vue";
defineOptions({
name: 'messageCenter'
})
const {proxy} = getCurrentInstance()
let show = ref(false)