feat: route path match
This commit is contained in:
15
src/pages/panel/MePage.vue
Normal file
15
src/pages/panel/MePage.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<script lang="ts" setup></script>
|
||||
|
||||
<template>
|
||||
<div class="hero min-h-screen bg-base-200">
|
||||
<div class="hero-content text-center">
|
||||
<div class="max-w-md">
|
||||
<h1 class="text-5xl font-bold">我的</h1>
|
||||
<p class="py-6">这是一个自动路由注册的示例页面</p>
|
||||
<p>路径将自动转换为 /panel/me</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
@@ -35,6 +35,32 @@ function getComponentNameFromPath(filePath: string): string {
|
||||
return filePath.split("/").pop() || "";
|
||||
}
|
||||
|
||||
/**
|
||||
* Generate route path from full file path, preserving directory structure
|
||||
* @param filePath Full path to the component file (e.g., "@/pages/test/AbcPage.vue")
|
||||
* @returns Route path (e.g., "/test/abc")
|
||||
*/
|
||||
function generateRoutePathFromFilePath(filePath: string): string {
|
||||
// Remove the "@/pages" prefix and get the relative path
|
||||
const relativePath = filePath.replace(/^@\/pages\//, "");
|
||||
|
||||
// Split into directory parts and filename
|
||||
const pathParts = relativePath.split("/");
|
||||
const fileName = pathParts.pop() || "";
|
||||
const directories = pathParts.splice(3);
|
||||
|
||||
// Transform the filename using existing logic
|
||||
const transformedFileName = formatPathFromComponentName(fileName);
|
||||
|
||||
// Combine directory path with transformed filename
|
||||
const fullPath =
|
||||
directories.length > 0
|
||||
? `/${directories.join("/")}/${transformedFileName}`
|
||||
: `/${transformedFileName}`;
|
||||
|
||||
return fullPath;
|
||||
}
|
||||
|
||||
/**
|
||||
* Generate routes from page components using Vite's import.meta.glob
|
||||
* @returns Array of route configurations
|
||||
@@ -46,7 +72,7 @@ function generateRoutesFromPages(): RouteRecordRaw[] {
|
||||
|
||||
for (const path in pages) {
|
||||
const componentName = getComponentNameFromPath(path);
|
||||
const routePath = `/${formatPathFromComponentName(componentName)}`;
|
||||
const routePath = generateRoutePathFromFilePath(path);
|
||||
|
||||
// Special case for home page
|
||||
const finalPath = routePath.toLowerCase() === "/home" ? "/" : routePath;
|
||||
|
||||
Reference in New Issue
Block a user