56 lines
1.9 KiB
TypeScript
56 lines
1.9 KiB
TypeScript
import { useLocation, Link } from "@remix-run/react";
|
|
|
|
export default function DebugPage() {
|
|
const location = useLocation();
|
|
|
|
return (
|
|
<div className="p-6">
|
|
<h1 className="text-2xl font-bold mb-4">路由诊断页面</h1>
|
|
|
|
<div className="bg-gray-100 p-4 rounded mb-6">
|
|
<h2 className="text-xl font-semibold mb-2">当前路径信息</h2>
|
|
<pre className="bg-white p-3 rounded border">
|
|
{JSON.stringify({
|
|
pathname: location.pathname,
|
|
search: location.search,
|
|
hash: location.hash,
|
|
key: location.key,
|
|
state: location.state
|
|
}, null, 2)}
|
|
</pre>
|
|
</div>
|
|
|
|
<div className="mb-6">
|
|
<h2 className="text-xl font-semibold mb-2">测试链接</h2>
|
|
<div className="flex flex-col space-y-2">
|
|
<Link to="/" className="text-blue-500 hover:underline">首页 - /</Link>
|
|
<Link to="/rules" className="text-blue-500 hover:underline">评查点列表 - /rules</Link>
|
|
<Link to="/rules/1" className="text-blue-500 hover:underline">评查点详情 - /rules/1</Link>
|
|
<a href="/rules" className="text-green-500 hover:underline">原生链接 - /rules</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h2 className="text-xl font-semibold mb-2">跳转测试</h2>
|
|
<button
|
|
onClick={() => {
|
|
window.location.href = '/rules';
|
|
}}
|
|
className="bg-blue-500 text-white px-4 py-2 rounded mr-2 hover:bg-blue-600"
|
|
>
|
|
直接跳转到 /rules
|
|
</button>
|
|
|
|
<button
|
|
onClick={() => {
|
|
window.history.pushState({}, '', '/rules');
|
|
window.dispatchEvent(new PopStateEvent('popstate'));
|
|
}}
|
|
className="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600"
|
|
>
|
|
使用History API跳转到 /rules
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|