Silently change url to previous using Backbone.js

问题

Using Backbone.js, is it possible to make the router navigate to the page where it came from? I'd like to use that for the case where I change my URL when a popup appears, and I want go change it back, when I hide the popup. I don't want to simply go back, because I want to keep the background page in precisely the same position as I left it before I showed the popup

回答1:

You can solve this problem by extending Backbone.Router and storing all the routes during navigation.

class MyRouter extends Backbone.Router
  constructor: (options) ->
    @on "all", @storeRoute
    @history = []
    super options

  storeRoute: ->
    @history.push Backbone.history.fragment

  previous: ->
    if @history.length > 1
      @navigate @history[@history.length-2], true

Then, when you have to dismiss your modal, simply call the MyRouter.previous() method that it will redirect you back to the last "hash".

回答2:

I think mateusmaso's answer is mostly right but requires some tweaks to guarentee that you always get the right URL you are looking for.

First you need to override the route method to have a beforeRoute method fire:

route: (route, name, callback) =>
   Backbone.Router.prototype.route.call(this, route, name, =>
     @trigger('beforeRoute')
     callback.apply(this, arguments)
   )

Then you bind the event and initialize the history instance variable:

initialize: (options) ->       
   @history = []
   @on "beforeRoute", @storeRoute

Next create helper methods for storing and retrieving the fragment:

storeRoute: =>
   @history.push Backbone.history.fragment

previousFragment: =>
   @history[@history.length-2]

Finally, you need one final helper method that can be used to change the URL without reloading and store the resulting fragment. You need to use this when closing the pop up or you won't have the expected fragment in your history if the user gets the pop up again without navigating anywhere else. This is because calling navigate without "trigger: true" won't trigger the event handler to store the fragment.

changeAndStoreFragment: (fragment) =>
   @navigate(fragment)
   @storeRoute()

回答3:

This answer may not address the question, but it's preety much the same issue. I couldn't navigate silently to a previous route, or a custom route because of the trailing slash. In order for route functions to NOT be triggered, use {trigger:false}, or don't use trigger at all since false is the default behaviour, and make sure your route begins with #something instead of '#/something' (notice the slash), or change the regEx inside Backbone.js, the router part.