添加动态页面标题支持：根据不同页面和语言设置文档标题

Author: CC11001100

src/App.tsx

@@ -1,4 +1,4 @@
-import {BrowserRouter as Router, Route, Routes} from 'react-router-dom'
+import {HashRouter as Router, Route, Routes} from 'react-router-dom'
 import './App.css'
 import NavBar from './components/NavBar'
 import HomePage from './components/HomePage'
@@ -7,13 +7,15 @@ import ChallengeDetailPage from './components/ChallengeDetailPage'
 import ChallengeContributePage from './components/ChallengeContributePage'
 import AboutPage from './components/AboutPage'
 import GitHubRibbon from './components/GitHubRibbon'
+import PageTitle from './components/PageTitle'
 import './gh-fork-ribbon.css';
 import './styles/github-ribbon-fix.css';
 
 const App = () => {
     return (
         <Router>
             <div className="App">
+                <PageTitle />
                 <GitHubRibbon repositoryUrl="https://github.com/JSREP/crawler-leetcode" />
                 <NavBar/>
                 <div className="content-wrapper" style={{ padding: '20px 0' }}>

src/components/PageTitle.tsx

@@ -0,0 +1,37 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+
+/**
+ * 页面标题组件
+ * 根据当前路由自动设置文档标题
+ */
+const PageTitle = () => {
+  const location = useLocation();
+  const { t } = useTranslation();
+  
+  useEffect(() => {
+    let title = t('titles.default');
+    
+    // 根据路径设置不同的标题
+    if (location.pathname === '/') {
+      title = t('titles.home');
+    } else if (location.pathname === '/challenges') {
+      title = t('titles.challenges');
+    } else if (location.pathname === '/about') {
+      title = t('titles.about');
+    } else if (location.pathname === '/challenge/contribute') {
+      title = t('titles.contribute');
+    } else if (location.pathname.startsWith('/challenge/')) {
+      title = t('titles.challenge');
+    }
+    
+    // 设置文档标题
+    document.title = title;
+  }, [location.pathname, t]);
+  
+  // 此组件不渲染任何内容
+  return null;
+};
+
+export default PageTitle; 

src/locales/en.ts

@@ -7,6 +7,14 @@ export default {
         system: 'System',
         contribute: 'Contribute'
     },
+    titles: {
+        home: 'Home - Crawler LeetCode',
+        challenges: 'Challenges - Crawler LeetCode',
+        about: 'About - Crawler LeetCode',
+        contribute: 'Contribute - Crawler LeetCode',
+        challenge: 'Challenge - Crawler LeetCode',
+        default: 'Crawler LeetCode'
+    },
     home: {
         hero: {
             title: 'Web Crawler Challenge Collection',

src/locales/zh.ts

@@ -7,6 +7,14 @@ const zhTranslations = {
         system: '系统',
         contribute: '贡献题目'
     },
+    titles: {
+        home: '首页 - 爬虫技术挑战平台',
+        challenges: '挑战列表 - 爬虫技术挑战平台',
+        about: '关于 - 爬虫技术挑战平台',
+        contribute: '贡献题目 - 爬虫技术挑战平台',
+        challenge: '挑战详情 - 爬虫技术挑战平台',
+        default: '爬虫技术挑战平台'
+    },
     home: {
         hero: {
             title: '爬虫技术挑战合集',