Backbone.js: routing per le viste nidificate

Question

sto cercando di capire seguente scenario:

Diciamo che ho due viste: una per gli oggetti di visualizzazione e uno per l'acquisto di loro. Il problema è che la vista di acquisto è una vista secondaria per la visualizzazione.

per posa che ho:

var MyRouter = Backbone.Router.extend({ 
    routes: { 
    'item/:id': 'viewRoute', 
    'item/:id/buy': 'buyRoute' 
    } 
}); 

var router = new MyRouter; 

router.on("route:viewRoute", function() { 
    // initialize main view 
    App.mainview = new ViewItemView(); 

}); 

router.on("route:buyRoute", function() { 
    // initialize sub view 
    App.subview = new BuyItemView(); 
}); 

Ora se l'utente aggiorna la pagina e buyRoute viene attivato, ma ora non si è vista principale. Quale sarebbe la soluzione migliore per gestire questo?

Answer 1

Si suppone che il problema che si sta avendo in questo momento è che non si vuole mostrare alcune cose all'interno di ViewItem all'interno di BuyView? In tal caso, è necessario modularizzare ciò che BuyView e ViewItem hanno in comune in un'altra vista, quindi inizializzarlo su entrambe le rotte.

Ecco un esempio di codice da una delle mie applicazioni

https://github.com/QuynhNguyen/Team-Collaboration/blob/master/app/scripts/routes/app-router.coffee

Come potete vedere, ho modulare la barra laterale dal momento che può essere condiviso tra molti punti di vista. L'ho fatto in modo che possa essere riutilizzato e non causerà alcun conflitto.

Answer 2

È possibile controllare l'esistenza della vista principale e crearla/aprirla se non esiste già.

Generalmente creo (ma non apro) le viste principali della mia app all'avvio dell'ap, e quindi una sorta di view manager per l'apertura/chiusura. Per i progetti di piccole dimensioni, allego semplicemente le mie viste a una proprietà views del mio oggetto app, in modo che siano tutte in un unico posto, accessibili come views.mainView, views.anotherView, ecc.

Estendo anche Backbone.View con due metodi: open e close che non solo aggiunge/rimuove una vista al/dal DOM ma imposta anche un flag isOpen nella vista.

Con questo, è possibile controllare per vedere se una visione necessaria è già aperto, quindi lo si apre, se non, in questo modo:

if (!app.views.mainView.isOpen) { 
    // 
} 

Un'aggiunta opzionale potrebbe essere quella di creare un metodo sulla vostra applicazione chiamata clearViews che cancella tutte le viste aperte, ad eccezione forse dei nomi delle viste passate come parametro a clearViews. Quindi, se hai una vista della barra di navigazione che non vuoi cancellare su alcuni percorsi, puoi semplicemente chiamare app.clearViews('topNav') e tutte le viste tranne views.topNav verranno chiuse.

check-out questa sostanza per il codice per tutto questo: https://gist.github.com/4597606