backbone.js - tutorial - Backbone.Marionette onRender llama antes de que se visualice la vista en el navegador?

backbone significado

Question

El ajuste

Tengo Backbone.Marionette.ItemView que rinde algo de contenido. Cuando se procesa el contenido, me gustaría aplicar un complemento jQuery que convierte parte de la vista en un contenedor con una barra de desplazamiento.

La barra de desplazamiento se implementa completamente en javascript y luego de la inicialización tiene que verificar la altura del contenedor de desplazamiento así como la del contenido dentro del contenedor.

Si el contenido es más alto que el contenedor, se debe habilitar una barra de desplazamiento.

El problema

Si bien todo esto parece simple, me encontré con un problema extraño:

Si inicializo mi complemento de barra de desplazamiento directamente en la devolución de llamada onRender, parece pensar que el elemento .scroll-container tiene una altura 0 y una altura máxima de 0.

Sin embargo, si envuelvo el código de inicialización dentro de un tiempo de espera de 0ms, todo funciona como debería, la propiedad de altura del elemento .scroll-container es devuelta por jQuery correctamente y el plugin de barra de desplazamiento funciona muy bien.

El código

onRender: function() {
  var that = this;
  setTimeout(function() {
    that.onLayout();
    var $scrollContainer = that.$el.find(''.scroll-container''), 
        scrollPane = new ScrollPane($scrollContainer, {
          maxHeightProperty: ''maxHeight'',
          scrollUpButton: false,
          scrollDownButton: false
        });
  }, 0);
},

La pregunta

Supongo que el problema se debe a que el navegador no terminó de procesar el html recién insertado cuando se ejecuta la devolución de llamada onRender.

¿Es correcta esta suposición? Y si es así, ¿es confiable mi solución de utilizar un tiempo de espera de 0ms en circunstancias normales?

Answer 1

Como el complemento en cuestión depende del DOM, onRender no hará lo que necesita. Esta devolución de llamada se inicia después de que se haya visualizado la vista, pero no hay garantía de que el el la vista se haya agregado aún al DOM. De hecho, estás seguro suponiendo lo contrario, que aún no ha sido agregado.

Si está utilizando una Region Marionette para mostrar la vista, puede implementar un método onShow en su vista. La región llama a este método después de que la región haya agregado la vista al DOM. Fue implementado específicamente para manejar esta situación.

Para obtener un poco más de información sobre esto y sobre cómo trabajar con los complementos de jQuery en general, consulte esta publicación en el blog: http://lostechies.com/derickbailey/2012/02/20/using-jquery-plugins-and-ui-controls-with-backbone/