2017-06-29 3 views
0

J'ai un BackView ElementView qui a des DIVs avec ses classes et un DIV a la classe active.La fonction jQuery ne se déclenche pas sur Backbone View Render

J'écris une ligne jQuery pour cacher tous les éléments il n'y a pas la classe active mais ça ne marche pas.

Show.EventItemView = Marionette.ItemView.extend({ 
     template: '#id-template', 
     events: { 
      'click #js-tabs li.js-tab': 'tabs' 
     }, 
     tabs: function(e) { 
      var target = e.target, 
       tab_id = $(e.currentTarget).attr('js-data-tab-id'); 

      $('#js-tabs .js-tab-content').hide(); 
      $('#js-tabs .js-tab-content#' + tab_id).show(); 
     }, 
     initialize: function() { 
      $('#js-tabs .js-tab-content:not(.active)').hide(); 
      console.log('Initialized'); 
     } 
    }); 

Le texte « Initialisé » est affiché sur la console, mais les éléments qui n'a pas la classe active ne sont pas hidded.

Si cette ligne $('#js-tabs .js-tab-content:not(.active)').hide(); est exécutée directement dans la console Chrome, elle fonctionne mais doit être déclenchée automatiquement lors du rendu de la vue (ou d'une autre méthode).

Merci pour toute avance.

Répondre

2

initialize() est appelée lorsque la vue est instanciée et avant la méthode render(). Cela signifie que la vue n'a pas encore été rendue. Marionette.ItemView vous donne quelques méthodes de rappel utiles à utiliser.

onRender() est appelée sur chaque rendu. Si vous synchronisez des modèles sur le serveur, cela peut être appelé plusieurs fois, lorsque le contenu du modèle est mis à jour.

onShow() est appelée une fois par vue dans une région. Si vous utilisez regions, utilisez-le.

+0

Merci @vassiiskrikonis. L'utilisation de la méthode 'onShow()' fonctionne correctement. [Voici] (https://marionettejs.com/docs/master/viewlifecycle.html#show-view-events) quelques infos supplémentaires sur ces méthodes. – moreirapontocom

0

Dans la vue Backbone, l'initialisation est la première méthode qui est exécutée lorsqu'une vue est rendue. alors ici vous essayez de manipuler avant même que la vue soit rendue. Essayez de déplacer ce code dans la fonction de rendu ou après le chargement de la vue (page/contenu).

Essayez également de déboguer dans la console avec des points d'arrêt pour vous assurer que le contenu est chargé avant d'exécuter cette ligne de code.