Question

我尝试在我的项目中学习和使用Backbone / Marionette。现在我坚持使用路由器导航，虽然它不应该工作。

class MyApp.Router extends Marionette.AppRouter
    appRoutes :
        'info/:place/(:what)' : 'places_page'

MyApp.Controller = ->
    places_page: (place,what)->
        console.log 'Triggered places_page'


MyApp.addInitializer( ->
    controller = new MyApp.Controller()
    new MyApp.Router
        controller: controller
    Backbone.history.start( pushState: false )
    )


MyApp.vent.on('do:search', ->
    console.log 'triggered do:search'
    place = 'Moscow'
    what = 'Пицца'
    info_model.set place: place, item:what
    new_url = 'info/'+where+'/'+what
    if new_url != decodeURIComponent(Backbone.history.fragment)
        Backbone.history.navigate(new_url, {trigger: false})

在初次加载site.com/#info/Budapest/Vine页面或重新加载时，我会收到Triggered places_page消息，正如我所料。

但是，当我向site.com/#info/Moscow/Пицца发送更新网址的do:search事件时，我再次获得Triggered places_page！所以它从头开始重新加载我的所有视图，而不仅仅是更改URL并重新渲染一个模型。

我在这里做错了什么？

更新2： 发现奇怪的事情。如果我在新网址中使用拉丁字母，一切都会像它应该的那样工作。但是如果我在新的url路径中使用西里尔语，它将触发路由功能。

Backbone：1.0，Marionette：v1.0.3，jquery：1.9.1

Answer 1

神秘解决了！

这是因为url中的非拉丁符号。正确的代码：

new_url = 'info/'+encodeURIComponent(where)+'/'+encodeURIComponent(what)
if new_url != Backbone.history.fragment
    Backbone.history.navigate(new_url, {trigger: false})

因为如果url没有更改并且默认情况下navigate为false，Backboune.navigate不会执行trigger，我可以这么简单地写一下：

new_url = 'info/'+encodeURIComponent(where)+'/'+encodeURIComponent(what)
Backbone.history.navigate(new_url)

Answer 2

Backbone.history在启动时获取一个对象。在CoffeeScript中尝试这种语法：

Backbone.history.start
  pushState: false

此外，pushState默认为false，因此您可以Backbone.history.start()

这会解决您的问题吗？

Answer 3

需要正确的URL编码。我在与路由器功能相关的Backbone文档中找不到这个。

我有同样的问题，在查询部分有空格，即：

#app/terms?filter=java ee

与你的答案中描述的encodeURIComponent解决方案一起，我还在backbone.js（1.0.0）中找到了与导航功能相关的以下注释行：

// Save a fragment into the hash history, or replace the URL state if the
// 'replace' option is passed. You are responsible for properly URL-encoding
// the fragment in advance.

Backbone.history.navigate忽略trigger：false

3 个答案: