kurihada
4ce6ea469c
- error.tsx: 路由级错误边界，提供重试和返回首页操作 - global-error.tsx: 根布局级兜底，纯内联样式避免依赖加载 - RestaurantImage: 可复用图片组件，加载失败显示餐具占位图标 - 替换 RestaurantCard、MatchResult、profile 中所有餐厅图片
46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
"use client";
|
||
|
||
import { useEffect } from "react";
|
||
|
||
export default function GlobalError({
|
||
error,
|
||
reset,
|
||
}: {
|
||
error: Error & { digest?: string };
|
||
reset: () => void;
|
||
}) {
|
||
useEffect(() => {
|
||
console.error("[GlobalError]", error);
|
||
}, [error]);
|
||
|
||
return (
|
||
<html lang="zh-CN">
|
||
<body style={{ margin: 0, fontFamily: "system-ui, sans-serif", background: "#0a0a0a", color: "#e5e5e5" }}>
|
||
<div style={{ display: "flex", minHeight: "100dvh", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: "1.5rem" }}>
|
||
<div style={{ fontSize: "3rem" }}>⚠️</div>
|
||
<h1 style={{ marginTop: "1.5rem", fontSize: "1.25rem", fontWeight: 700 }}>应用崩溃了</h1>
|
||
<p style={{ marginTop: "0.5rem", fontSize: "0.875rem", color: "#a3a3a3", textAlign: "center" }}>
|
||
发生了严重错误，请尝试刷新页面
|
||
</p>
|
||
<button
|
||
onClick={reset}
|
||
style={{
|
||
marginTop: "2rem",
|
||
padding: "0.625rem 1.5rem",
|
||
fontSize: "0.875rem",
|
||
fontWeight: 600,
|
||
color: "#fff",
|
||
background: "#e11d48",
|
||
border: "none",
|
||
borderRadius: "0.75rem",
|
||
cursor: "pointer",
|
||
}}
|
||
>
|
||
刷新重试
|
||
</button>
|
||
</div>
|
||
</body>
|
||
</html>
|
||
);
|
||
}
|