La vista Backbone.JS se representa, pero no se muestra en la página

StackOverflow https://stackoverflow.com//questions/9634508

Pregunta

Estoy trabajando para convertir una aplicación de una sola página a backbone.JS.La vista siguiente utiliza la etiqueta del cuerpo como nombre de etiqueta; es decir, quiero que la vista ocupe todo el contenido de la página.No quiero utilizar divs de contenedores u otros trucos. 

var ThingView = Backbone.View.extend({  
    tagName : "body",
            ... 


    // Show the HTML for the view 
    render : function() {  
        console.log('Displaying thing')
        $(this.el).append('<h1>test</h1>');
        console.log('finished')
        console.log($(this.el))
        return this; // For chaining

Al renderizar, veo 

finished
[
<body>​
    <h1>​test​</h1>​
</body>​
]

Pero después de inspeccionar el DOM, el cuerpo ya no tiene el texto.

¿Fue útil?

Solución

tagName indica qué etiqueta debe usar Backbone para crear su el si el constructor no proporciona ningún el.El elemento creado no se inserta automáticamente en el DOM.

La forma más sencilla probablemente sea crear su vista con su el configurado en body :

new ThingView({el:'body'})

Otros consejos

Lo que explicó Nikoshr es correcto.Agregándolo, usando TagName es correcto.Pero idealmente debe usar El elemento, que se define en la biblioteca backbone.js como un elemento (EL) de la vista.

A continuación se muestra el código ideal que debe usar al hacer esto. 

<script type="text/javascript">
            $(document).ready(function(){  
             var ThingView  = Backbone.View.extend({
                    el:$("body"),                   
                    initialize: function(){
                            _.bindAll(this,"render");
                            this.render();  
                    },
                    render:function(){
                        this.el.append('<h1>test</h1>');    
                        console.log('finished');
                        console.log($(this.el).html());                     
                    }
                });    
                var ThingView = new ThingView();
            });
</script>

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top