PageNotFoundPage 组件

浅色 深色
DesktopPageNotFoundLight
DesktopPageNotFoundDark

PageNotFoundPage 组件是一个 React 组件，用于在页面未找到（404 错误）时显示用户友好的消息。它提供了一个视觉指示，表明请求的页面不可用，并提供一个按钮导航回上一页。

直播预览链接

组件代码链接

先决条件

  • 确保您的项目中已安装 @neo4j-ndl 库，以便使用此 PageNotFound 组件。

用法

要将 PageNotFoundPage 组件集成到您的应用程序中，请确保它是您的路由配置的一部分

  1. 导入组件

import PageNotFoundPage from './path/to/PageNotFoundPage';

  1. 在您的路由器设置中为组件添加路由。这通常使用捕获所有路由来完成

import { Routes, Route } from 'react-router-dom';

<Routes>
  // ... All your other routes MUST be before this one
  <Route path="*" element={<PageNotFoundPage />} />
</Routes>

组件 Props

PageNotFoundPage 组件不接受任何 props。

关键组件

导航 Hook

该组件使用 useNavigate hook 以编程方式将用户导航回上一页

const navigate = useNavigate();

<Button onClick={() => navigate(-1)}>Go back</Button>

这利用了浏览器的历史堆栈将用户返回到他们之前所在的位置。

© . All rights reserved.