攔截式路由
攔截式路由允許你在當前佈局中載入來自應用程式其他部分的路由。當你想顯示某個路由的內容而不讓用戶切換到不同上下文時，這種路由模式非常有用。
例如，當用戶點擊動態消息中的照片時，你可以在模態框中顯示該照片並覆蓋在動態消息上方。這種情況下，Next.js 會攔截 /photo/123 路由，隱藏 URL 並將其覆蓋在 /feed 之上。
然而，當通過點擊可分享連結或刷新頁面導航到照片時，應該渲染整個照片頁面而非模態框。此時不應發生路由攔截。
約定
攔截式路由可以使用 (..) 約定來定義，這類似於相對路徑約定 ../，但用於路由片段。
你可以使用：
(.)匹配相同層級的片段(..)匹配上一層級的片段(..)(..)匹配上兩層級的片段(...)匹配從根app目錄開始的片段
例如，你可以通過建立 (..)photo 目錄從 feed 片段中攔截 photo 片段。
請注意
(..)約定是基於 路由片段 而非檔案系統。
範例
模態框
攔截式路由可與平行路由結合使用來建立模態框。這能幫助你解決建立模態框時的常見挑戰，例如：
- 讓模態內容可通過 URL 分享
- 刷新頁面時保留上下文而非關閉模態框
- 在後退導航時關閉模態框而非返回上一路由
- 在前進導航時重新打開模態框
考慮以下 UI 模式：用戶可以通過客戶端導航從相簿打開照片模態框，或直接通過可分享連結導航到照片頁面：
在上例中，photo 片段的路徑可以使用 (..) 匹配器，因為 @modal 是一個插槽而非片段。這意味著 photo 路由僅比當前位置高一層級，儘管它在檔案系統中高了兩層。
須知：
- 其他範例可能包括在頂部導航欄中打開登入模態框同時擁有專用的
/login頁面，或在側邊模態框中打開購物車。