我正在嘗試為以下網址組合設定路徑
- /red-cars-for-sale-fl
- /used-cars-for-sale-ca
- /new-cars-for-sale-ga
- /fast-cars-for-sale-fl 等等。
所有這些 url 都應該匹配一個組件 CarSaleComponent。同樣,boats-for-sale 的一組 url 應該實體化 BoatSaleComponent 等等
{ path: ':param1', component: CarSaleComponent },
{ path: ':param1', component: BoatSaleComponent },
{ path: 'contact', component: ContactComponent }
這不起作用,因為 /contact 也將匹配第一個路徑并實體化 CarSaleComponent。我正在使用一種解決方法
{ path: 'cars/:param1', component: CarSaleComponent },
{ path: 'boats/:param1', component: BoatSaleComponent },
{ path: 'contact', component: ContactComponent }
是否可以根據“cars-for-sale”或“boats-for-sale”子字串匹配路徑?
uj5u.com熱心網友回復:
您必須像最后一個將匹配任何情況一樣對齊路由路徑,因此代碼將是這樣的
{ path: 'contact', component: ContactComponent },
{ path: ':param1', component: CarSaleComponent }
這樣,如果聯系人被呼叫,如果沒有路由匹配,它就會作業,它會轉到引數一
uj5u.com熱心網友回復:
有兩種方法可以做到這一點。
您可以通過 URL 中的引數來告訴
boat/car. 根據您顯示/隱藏CarSaleComponent/的輸入BoatSaleComponent。不好的一面是,如果您添加更多待售商品,您可能需要添加一個配置來啟用/禁用組件串列。您可以為每個專案創建路由
item-for-sale并在查詢中傳遞必要的資訊。
{ path: 'car-for-sale', component: CarSaleComponent },
{ path: 'boat-for-sale', component: BoatSaleComponent },
{ path: 'contact', component: ContactComponent }
您還可以創建一個銷售模塊并在用戶嘗試訪問此特定資訊時延遲加載它。您還可以為其下的不同專案創建子路由并相應地路由它們。
此外,路由匹配基于它們在路由中從上到下的定義方式。因此,請始終按照您/最終匹配 root 的方式放置它們。
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/352697.html
標籤:有角的
