2012-06-06 19 views
10

Quiero tener cada petición que redirigir a mi index.html, y cualquier enlace (no #urls -/reales/URL) hizo clic en mi aplicación para ejecutar a través router.js por lo que hay esencialmente ninguna página refresca - puramente ajax. ¿Hay alguna manera fácil de hacerlo con el enrutamiento Backbone y htaccess?Backbone router no funciona con pushState

Lo tengo trabajando en este momento si me llevo {pushState: true} y formato mis enlaces como #login. Sin embargo, cuando habilito pushState y hago clic en #login, no pasa nada. En cambio, es solo una vez que actualizo la página que el Backbone interpreta el #login y sigue la ruta para representar loginView.

Aquí es mi router:

// Filename: router.js 
define([ 'views/beta/requestInvite', 'views/beta/login' ], 
function(requestInviteView, loginView) { 
    var AppRouter = Backbone.Router.extend({ 
     routes : { 
      // Pages 
      'login' : 'login', 

      // Default 
      '*actions' : 'defaultAction' 
     }, 

     // Pages 
     login : function() { 
      loginView.render(); 
     }, 

     defaultAction : function(actions) { 
      requestInviteView.render(); 
     } 
    }); 

    var initialize = function() { 
     var app_router = new AppRouter; 
     Backbone.history.start({pushState: true}); 
    }; 
    return { 
     initialize : initialize 
    }; 
}); 

Lo que me gustaría que suceda está en requestInviteView, cuando se hace clic en el enlace para /login, los cambios de URL a /login y la loginView se representa.

¡Gracias por cualquier ayuda!

Respuesta

10

Cambiar de hash a pushstate no es tan trivial como cambiar un solo parámetro como se puede pensar. Lo que hago es atrapar el evento click en mi vista y llamar a app.navigate para activar la ruta.

app.navigate("/login", {trigger: true}); 

http://backbonejs.org/#Router-navigate

+0

usted puede hacer esto de alguna manera de forma automática usando un método similar al [este GIST] (https : //gist.github.com/colllin/5717284). – colllin

5

Aunque la respuesta de Anthony va a funcionar, usando trigger: true no suele ser el mejor curso de acción. En su lugar, su aplicación debe estar estructurada para que pueda llamar al navigate con el valor trigger predeterminado que queda en false.

Derick Bailey habla sobre el tema en su blog en http://lostechies.com/derickbailey/2011/08/28/dont-execute-a-backbone-js-route-handler-from-your-code/ (apartado "La‘AHA!’Momento En cuanto al segundo argumento de Router.Navigate")

Además, un capítulo que explica con más detalle enrutamiento (incluyendo por qué debe dejar trigger a false) pueden ser descargadas gratis en esta muestra pdf libro: http://samples.leanpub.com/marionette-gentle-introduction-sample.pdf (información completa: soy el autor del libro)

+1

interesante, pero replicar la lógica para cada controlador solo para evitar un segundo parámetro parece redundante. tengo escenarios raros en los que uso esto (es decir, cuando se solicita una ruta fuera de servicio, la cambio sobre la marcha y la visualizo correctamente). El contexto de esta pregunta es desencadenar una acción después de hacer clic en un enlace, y creo que lo desencadenaré como el mejor para hacer esto. – Garrett