javascript - Backbone.js 父 View 与 subview

Question

使用Backbone.js做前端开发，有没有可靠的方法先渲染子view再渲染各自的parent view？有这方面的模式吗？我能够渲染 subview ，但我必须小心始终先渲染父 View 。是否有一种模式可以在 parent 之前安全地呈现 child ？

Answer 1

有一种方法可以做到这一点，那就是使用 jQuery。 jQuery 有一个 find() 函数。 https://api.jquery.com/find/

假设我有一个 Backbone.View 实例，它创建并写入其自定义元素 (el)，默认情况下它是一个 div 元素。下面的代码在我的 View 的渲染函数中:

              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})

上面的方法有效，我想说这是一个很好的解决方案，可以将 subview 渲染到父 View ，而无需先将父 View 放在 DOM 中。正如我所说，诀窍是使用 $(this.el).find('#xyz');。如果有更好的方法，我很想听听，但这似乎很有效。

我的上述模板由 $template 表示，如下所示:

<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>