Web-Dev-For-Beginners/translations/zh-TW/7-bank-project/1-template-route/assignment.md

# 改善路由

## 指示

現在你已經建立了基本的路由系統，是時候用專業功能來增強它，以改善使用者體驗並提供更好的開發工具。實際應用程式需要的不僅是模板切換－它們需要動態頁面標題、生命週期鉤子和可擴充的架構。

在此作業中，你將擴展你的路由實現，加入兩個在生產網頁應用中常見的基本功能。這些增強將讓你的銀行應用感覺更完善，並為未來功能打下基礎。

路由宣告目前只包含要使用的模板 ID，但在顯示新頁面時，有時需要更多資訊。讓我們用兩個額外功能來改善我們的路由實作：

### 功能 1：動態頁面標題
**目標：** 為每個模板指定標題，並在模板變更時動態更新視窗標題。

**重要性：**
- **提升**使用者體驗，顯示具描述性的瀏覽器分頁標題
- **增強**輔助技術如螢幕閱讀器的可用性  
- **提供**更好的書籤和瀏覽器歷史記錄上下文
- **遵循**專業網頁開發最佳實務

**實作方向：**
- **擴充** routes 物件以包含每個路由的標題資訊
- **修改** `updateRoute()` 函式，使其動態更新 `document.title`
- **測試**在切換不同畫面時標題是否正確變更

### 功能 2：路由生命週期鉤子  
**目標：** 新增選項可在模板變更後執行某段程式碼。我們希望每次顯示「Dashboard」頁面時，都在開發者主控台印出 `'Dashboard is shown'`。

**重要性：**
- **允許**在特定路由載入時執行自定義邏輯
- **提供**分析、紀錄或初始化程式碼的鉤子
- **建立**更複雜路由行為的基礎
- **展現**網頁開發中的觀察者模式

**實作方向：**
- **加入**選用的回呼函式屬性至路由設定
- **在**模板渲染完成後執行該回呼函式（若有定義）
- **確保**此功能對所有帶回呼的路由有效
- **測試**訪問 Dashboard 時，主控台訊息是否顯示

## 評量標準

| 標準 | 優異                                                                                                                          | 及格                                                                                                                                                                                  | 需改進                                       |
| -------- | ----------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- |
|          | 兩項功能皆已實作且可運作。對 `routes` 宣告新增的路由也適用標題及程式碼加入功能。                                               | 兩項功能可運作，但行為為硬編碼，且無法透過 `routes` 宣告設定。新增第三個有標題及程式碼的路由時，功能無法或部分運作。                                                           | 有一項功能缺失或無法正常運作。                |

---

<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**免責聲明**：  
本文件係使用 AI 翻譯服務 [Co-op Translator](https://github.com/Azure/co-op-translator) 進行翻譯。雖然我們努力追求準確性，但請注意自動翻譯可能包含錯誤或不準確之處。原始文件的母語版本應被視為權威來源。對於重要資訊，建議採用專業人工翻譯。我們不對因使用本翻譯而產生的任何誤解或誤譯承擔任何責任。
<!-- CO-OP TRANSLATOR DISCLAIMER END -->