Cambio de puntos de vista con la columna vertebral

Question

estoy buscando el mejor patrón para cambiar de vista utilizando Backbone.js

Digamos que tiene una estructura DOM básico como esto:

<div id="header">Some fixed content</div> 
<div id="mainContainer"></div> 
<div id="footer">Some other content</div> 

y tengo dos puntos de vista " viewOne "y" viewTwo "que quiero mostrar alternativamente en mainContainer.

El router debe ser algo como esto:

routes: { 
    'one': 'pageOne', 
    'two': 'pageTwo' 
},  
pageOne: function() { 
    viewOne.render(); 
}, 
pageTwo: function(){ 
    viewTwo.render(); 
} 

Dónde debo añadir o quitar el view.el al DOM? ¿Cuál es el mejor patrón para cambiar entre las vistas?

Answer 1

Usaría una vista de nivel superior (adjunta a #mainContainer) que sería responsable de representar sus vistas secundarias. Según lo que describes, tus puntos de vista son demasiado diferentes para considerar representarlos con una vista única basada en algunas condiciones, y creo que siempre es más limpio tener un árbol jerárquico de vistas, de modo que representar toda la página es básicamente una llamada a la cima. vista de nivel .render() (que delega a los niños).

Su vista de nivel de contenedor principal podría exponer dos funciones, digamos renderPageOne y renderPageTwo, y eso es todo lo que el enrutador debe saber. Dentro de estas funciones, puede realizar un seguimiento de la vista secundaria para representar y llamar a this.render() que borra el contenido actual (usando jQuery's .empty() en el contenedor principal el), e inserta el elemento superior correcto de la vista secundaria (el .el).