使用Backbone和Backbone.Marionette進行復雜的路由

Question

我正在使用Google Maps應用一段時間。 該應用程序正在使用Backbone＆Backbone.Marionette。 您可以在此處找到其外觀的屏幕截圖： https : //www.facebook.com/photo.php?fbid=566101353505241&set=a.516037321844978.1073741832.145077908940923&type=3&theater

在過去的兩個小時中，我試圖找到使用Backbone Router保持應用程序狀態的高級示例，但是我找不到比帶有單個路由參數的示例更高級的示例：#about #notes等...

這就是我想要做的。

當用戶在地圖上四處移動時，我更改了網址以反映以下內容：/：lat /：lng /：zoom

當用戶從右側列表中選擇任何標記時，我會將網址更改為：/：lat /：lng /：zoom / hotspot /：id

右邊的列表正在使用Backbone.Paginator。 因此，當用戶單擊任何頁面時，URL都會更改為：/：lat /：lng /：zoom / page /：id

現在，如果用戶單擊熱點，我要將URL更改為：/：lat /：lng /：zoom / page /：id / hotspot /：id

例如，如果用戶在應用程序中使用了路線功能，則我希望該網址反映出來：

/：緯度/：LNG /：縮放/方向/：啟動/：端

如果他在使用路線應用之前或之后使用熱點列表，我想將網址更改為：/：lat /：lng /：zoom / direction /：start /：end / page /：id / hotspot /：id

你明白了。 我想讓用戶可以使用應用程序的任何部分，然后與任何人共享鏈接。

正如我所說的，我正在使用Backbone.Marionette-所以我的應用程序中有很多子應用程序負責地圖視圖，列表視圖，路線視圖等。

我的問題如下：

1. 如何正確使用belish.navigate？ 當用戶在地圖上四處移動時，我可以輕松更改/：lat /：lng /：zoom。 但是現在，如果用戶單擊任何熱點，而我只是傳遞了rib.navigate（'hotspot / 200'）->網址將更改為＃hotspot / 200，帶有lat / lng / zoom的部分將會丟失。 我在上面列出的任何其他網址也是如此。 如果我只是傳遞需要添加到url的部分，主干將清除整個哈希並添加我的新部分。 你怎么處理那件事呢？ 您是否有一個全局函數來跟蹤所有可能的URL組合，並根據當前情況進行添加或替換？

2. 如果我們以這個網址為例：

   /：LAT /：LNG /：放大/方向/：開始/：結束/頁/：ID /熱點/：ID

   /：lat /：lng /：zoom-地圖應用程序方向需要此部分/：start /：end-方向應用程序需要此部分

   page /：id-熱點應用需要此部分

   hotspot /：id-熱點應用需要此部分

您如何管理此類網址？ 我基本上需要一個接一個地調用上述應用程序，以便重新創建應用程序狀態。

有什么辦法可以不發瘋嗎？ 歡迎使用任何高級骨干路由器（甚至只是HTML5歷史記錄）用法或提示的示例！

Answer 1

我將創建一個navigate(newState)類型的函數，該函數檢查應用程序的當前狀態（即URL）。 通過使用當前URL，您可以根據所有條件生成下一個URL，只需將新狀態添加到當前狀態，或在適當的地方替換當前狀態的一部分即可。 完成后，使用您的新URL調用Backbone.navigate 。