攔截路由
攔截路由允許您從應用程式中的其他部分載入路由，同時保持目前的佈局。當您想要顯示路由的內容而不讓使用者切換到不同的上下文時，這種路由模式會很有用。
例如，當點擊動態消息中的照片時，您可以在覆蓋動態消息的模態框中顯示照片。在這種情況下，Next.js 會攔截 /photo/123 路由，隱藏網址，並將其覆蓋在 /feed 之上。
但是，當透過點擊可分享的網址或重新整理頁面來瀏覽照片時，應該渲染整個照片頁面而不是模態框。不應發生路由攔截。
慣例 (Convention)
攔截路由可以使用 (..) 慣例來定義，它類似於相對路徑慣例 ../，但適用於區段。
您可以使用
(.)來匹配**同一級別**的區段(..)來匹配**上一級別**的區段(..)(..)來匹配**上兩級別**的區段- 使用
(...)來匹配從根目錄app開始的路徑區段。
例如，您可以透過建立 (..)photo 目錄來攔截 feed 區段內的 photo 區段。
請注意，
(..)慣例是基於*路由區段*，而不是檔案系統。
範例
模態視窗
路由攔截可以與平行路由一起使用來建立模態視窗。這讓您能解決構建模態視窗時的常見挑戰，例如：
- 讓模態視窗的內容可以透過網址分享。
- 在頁面重新整理時保留上下文，而不是關閉模態視窗。
- 在向後導航時關閉模態視窗，而不是前往先前的路由。
- 在向前導航時重新開啟模態視窗.
考慮以下 UI 模式：使用者可以透過客戶端導航從圖庫開啟照片模態視窗，或直接從可分享的網址導覽至照片頁面。
在上述範例中，通往 photo 區段的路徑可以使用 (..) 匹配器，因為 @modal 是一個插槽，而不是一個區段。這表示 photo 路由只比其高一級區段，儘管在檔案系統中高了兩級。
注意事項
- 其他範例包括在頂部導覽列中開啟登入模態視窗，同時也有一個專用的
/login頁面，或在側邊模態視窗中開啟購物車。
這個有幫助嗎？