# 改善路由 ## 指示 現在您已經建立了一個基本的路由系統，是時候通過專業功能來提升它，以改善用戶體驗並提供更好的開發工具。真實世界的應用程式需要的不僅僅是模板切換——它們還需要動態頁面標題、生命週期掛鉤以及可擴展的架構。 在這次作業中，您將擴展您的路由實現，加入兩個在生產環境的網頁應用程式中常見的重要功能。這些改進將使您的銀行應用程式更加完善，並為未來的功能提供基礎。 目前的路由宣告僅包含要使用的模板 ID。但在顯示新頁面時，有時需要更多的內容。讓我們通過以下兩個額外功能來改善路由實現： ### 功能 1：動態頁面標題 **目標：** 為每個模板提供標題，並在模板更改時使用新標題更新窗口標題。 **為什麼這很重要：** - **改善** 用戶體驗，顯示描述性的瀏覽器標籤標題 - **增強** 屏幕閱讀器和輔助技術的可訪問性 - **提供** 更好的書籤和瀏覽器歷史記錄上下文 - **遵循** 專業的網頁開發最佳實踐 **實現方法：** - **擴展** 路由物件以包含每個路由的標題資訊 - **修改** `updateRoute()` 函數以動態更新 `document.title` - **測試** 在不同頁面之間導航時，標題是否正確更改 ### 功能 2：路由生命週期掛鉤 **目標：** 添加一個選項，在模板更改後執行一些代碼。我們希望每次顯示儀表板頁面時，在開發者控制台中打印 `'Dashboard is shown'`。 **為什麼這很重要：** - **啟用** 在特定路由加載時執行自定義邏輯 - **提供** 分析、日誌記錄或初始化代碼的掛鉤 - **創建** 更複雜路由行為的基礎 - **展示** 網頁開發中的觀察者模式 **實現方法：** - **添加** 一個可選的回調函數屬性到路由配置中 - **執行** 回調函數（如果存在）在模板渲染完成後 - **確保** 此功能適用於任何定義了回調的路由 - **測試** 在訪問儀表板時，控制台消息是否出現 ## 評分標準 | 評分標準 | 卓越 | 合格 | 需要改進 | | -------- | ----------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------- | | | 兩個功能均已實現並正常運作。標題和代碼添加也適用於在 `routes` 宣告中新增的路由。 | 兩個功能正常運作，但行為是硬編碼的，無法通過 `routes` 宣告進行配置。新增第三個具有標題和代碼添加的路由無法正常運作或僅部分運作。 | 缺少其中一個功能或功能未正常運作。 | --- **免責聲明**： 本文件已使用 AI 翻譯服務 [Co-op Translator](https://github.com/Azure/co-op-translator) 進行翻譯。儘管我們努力確保翻譯的準確性，但請注意，自動翻譯可能包含錯誤或不準確之處。原始文件的母語版本應被視為權威來源。對於關鍵信息，建議使用專業人工翻譯。我們對因使用此翻譯而引起的任何誤解或誤釋不承擔責任。