靈活的JavaScript單頁面應用程序的路由？

我正在構建一個單一的網頁應用程序（因爲我想跨越頁面/狀態時的靈活性和速度），但我努力與路由/網址...靈活的JavaScript單頁面應用程序的路由？

在傳統的範例我會有這樣的網址爲：

example.com/tools/population-tool/#currentYear=1950 
example.com/tools/income-tool/#country=usa 
example.com/nice-story/ 
example.com/nice-chapter/nice-story/

現在我想和一個路由器，以取代本（例如，使用主鏈）加載針對相應路由模板和控制器。

我在想有網頁對象，用於存儲必要的頁面信息：

pages : { 
    tools : { 
    template : "#tools", 
    breadcrumb : ["Home","Tools"] 
    } 
    nice-story : { 
    template : "#nice-story", 
    breadcrumb : ["Home","Stories","Nice Story"] 
    } 
}

與路由器，我現在想的負載正確的內容和頁面狀態，獲得一個網址，如：

example.com/#!/tools/population-tool/?currentYear=1950

或這樣如果不使用Hashbang：

example.com/tools/population-tool/?currentYear=1950

你將如何組織此路由，這樣的URL方案是有道理的，同時仍然靈活，允許重定向和新的查詢字符串PARAMATERS？

來源

2011-11-18 dani

我發現這個主幹插件：github.com/jhudson8/backbone-query-parameters。你剛插上它，你就準備好了。 – PreslavLe

這不是一個完整的回答你的問題，但對骨幹網的一些技巧...

您可能要定義你的路由器上像loadPage（）的方法可以清空並更換主頁容器其視圖對應於您應用中的每個「頁面」。每個路由動作都可以調用它來加載正確的視圖。

如果您將使用僞查詢字符串，請確保在您的Backbone路由中明確添加匹配器。例如：

'/tools/population-tool/?*params'

這將使用整個params字符串作爲第一個參數來調用您的路由操作。你需要解析...

來源

2011-11-18 18:43:16 maxl0rd

感謝您的回覆！這是否意味着將所有頁面明確列爲路由？我希望有一個更簡單的解決方案，如'：page /：subpage /？* params'？謝謝。 – dani

如果你願意，你可以這樣做。然後，您只需將所有邏輯移入一個路由功能，即可檢查您的「頁面」對象。我認爲定義1：1的頁面路由更爲常見，但這取決於你的用例。 – maxl0rd

靈活的JavaScript單頁面應用程序的路由？

回答

相關問題