Backbone.js parent vs. child views

Question

Использование Backbone.js для разработки на переднем конце, есть ли надежный способ визуализации дочернего представления перед отображением соответствующего родительского представления? Есть ли образец для этого? Я могу отображать дочерние представления, но я должен быть осторожным, чтобы всегда отображать родителя. Есть ли образец для безопасного воспроизведения детей перед родителями?

Answer 1

Существует один способ сделать это, используя jQuery. Функция jQuery имеет функцию find(). https://api.jquery.com/find/

У меня есть экземпляр Backbone.View, который создает и записывает его самоопределяемый элемент (el), который является элементом div по умолчанию. Приведенный ниже код внутри функции визуализации моего зрения:

   var self = this; 

       var ret = EJS.render($template, {}); //get the template html 

       self.$el.html(ret); //put the html string into self.$el (still not in the DOM though!!) 

       //Facebook's React.js lib 
       React.render(
        <TimerExample start={Date.now()} />, 
        $(self.el).find('#react-timer-example-div-id')[0] 
       ); 


       React.render(
        <MenuExample items={ ['Home', 'Services', 'About', 'Contact us'] } />, 
        $(self.el).find('#react-menu-example-div-id')[0] 
       ); 


      //using the two-way data binding lib "Rivets" 
      Rivets.bind($(self.el).find('#some-id')[0], {obj: exampleObj}) 

Вышеуказанные работы, и я хотел бы сказать, что это отличное решение, чтобы сделать дочерние представления к родительскому мнению, без родительского вида первого, находясь в DOM. Трюк, как я сказал, заключается в использовании $(this.el).find('#xyz');. Если есть лучший способ, я хотел бы услышать это, но это, похоже, работает очень хорошо.

Мой шаблон выше представлен $ шаблон, выглядит следующим образом:

<div> 
    <div id="react-timer-example-div-id">timer example goes here</div> 
    <div id="react-menu-example-div-id">menu example goes here</div> 
    <div id="some-id">blah blah</div> 
</div>