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');。如果有更好的方法，我很乐意听到，但这似乎很有效。

我的模板由$ 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>

Backbone.js父视图和子视图

1 个答案: