Question

我的索引页面加载正确，但是当我点击链接时，我的'/notes/:id': 'showNote'路由无法正常工作。我不确定这条路线是否存在问题，或者Backbone.history.navigate(url, trigger: true)是否存在问题。 I created screen cast of the problematic behavior here.

路由器/ scratchpad_router.js.coffee

class App.Routers.ScratchpadRouter extends Backbone.Router
  routes:
    '': 'index'
    '/notes/:id': 'showNote'

  index: ->
    view = new App.Views.Notes(collection: App.AllNotes)
    $('#container').html(view.render().el)

  showNote: (id) ->
     alert 'works'

scratchpad.js.coffee

window.Scratchpad =
  Models: {}
  Collections: {}
  Views: {}
  Routers: {}
  initialize: -> 
    @AllNotes = [
      {id: 1, title: "The first note", content: "I am indeed the very first of all notes"}
      {id: 2, title: "The second note", content: "There is nothing wrong with being second in note world"}
      {id: 3, title: "Get almond milk", content: "No sugar, not vanilla"}
    ]
    new @Routers.ScratchpadRouter
    Backbone.history.start(pushState: true)


window.App = window.Scratchpad

$(document).ready ->
  Scratchpad.initialize()

视图/ notes.js.coffee

class App.Views.Notes extends Backbone.View
  template: JST['notes/index']

  events: 
    'click a': 'showNote'

  render: ->
    @$el.html(@template(notes: @collection))
    this

  showNote: (e) ->
    $this = $(e.currentTarget)
    url = $this.attr("href")
    Backbone.history.navigate(url, trigger: true)
    return false

../模板/注意到/ index.jst.eco

<ul>
  <% for note in @notes: %>
    <li>
      <dl>
        <dt>Title</dt>
        <dd><a href="/notes/<%= note.id %>"><%= note.title %></a> </dd>
        <dt>Content</dt>
        <dd><%= note.content %></dd>
       </dl>
    </li>
  <% end %>
</ul>

Answer 1

我怀疑您的问题出在您的点击监听器中：

showNote: (e) ->
    $this = $(e.currentTarget)
    url = $this.attr("href")
    Backbone.history.navigate(url, trigger: true)
    return false

我首先认为这个事件监听器不是必需的，因为一旦你使用pushState = true，用户只需点击它就会发生同样的事情。

我建议你评论这个块，看看问题是否仍然存在。如果问题消失，我相信你可以没有那个障碍。

骨干导航/路由无法使用Rails

1 个答案: