48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
import ErrorPage from "hooks/Error";
|
|
import layout from "themes/echoes/layout";
|
|
import article from "themes/echoes/article";
|
|
import about from "themes/echoes/about";
|
|
import { useLocation } from "react-router-dom";
|
|
import post from "themes/echoes/post";
|
|
import { memo, useCallback } from "react";
|
|
|
|
const args = {
|
|
title: "我的页面",
|
|
theme: "dark",
|
|
nav: '<a href="/">index</a><a href="/error">error</a><a href="/about">about</a><a href="/post">post</a>',
|
|
} as const;
|
|
|
|
const renderLayout = (children: React.ReactNode) => {
|
|
return layout.render({
|
|
children,
|
|
args,
|
|
});
|
|
};
|
|
|
|
const Routes = memo(() => {
|
|
const location = useLocation();
|
|
const path = location.pathname.split("/")[1];
|
|
|
|
// 使用 useCallback 缓存渲染函数
|
|
const renderContent = useCallback((Component: any) => {
|
|
return renderLayout(Component.render(args));
|
|
}, []);
|
|
|
|
// 根据路径返回对应组件
|
|
if (path === "error") {
|
|
return renderContent(ErrorPage);
|
|
}
|
|
|
|
if (path === "about") {
|
|
return renderContent(about);
|
|
}
|
|
|
|
if (path === "post") {
|
|
return renderContent(post);
|
|
}
|
|
|
|
return renderContent(article);
|
|
});
|
|
|
|
export default Routes;
|