Backbone.js - 向頁面呈現一個新元素

Question

假設您在 View 中創建了一個新元素 - 即您沒有使用el定位頁面上的現有元素。

var StudentView = Backbone.View.extend({
  tagName: 'article',
  className: 'student-name',
  template: _.template($('#name-tpl').html()),

  render: function(){
    var student_tpl = this.template({name: 'Rikard'});
    this.$el.html(student_tpl);
  }
});

然后實例化 View 並調用它的 render 方法：

var student_view = new StudentView();
student_view.render();

您的 HTML 包含以下模板：

<div class="target">
  <script id="name-tpl" type="text/template">
    <%= name %>
  </script>
</div>

這不會將新創建的元素打印到頁面。 如果我們將el設置為.target ，那么它會起作用，但是它不會打印您在視圖中設置的標簽名稱或類名稱。

有沒有辦法將新創建的元素打印到頁面上？ 我想過使用 jQuery append ，但似乎應該有一個更面向主干的解決方案。

Answer 1

除非您使用el選項將視圖附加到 DOM 中的現有元素， backbone.js會在內存中創建一個HTMLElement ，與DOM分離。 您有責任將它附加到您想要的位置（主干為您創建一個新元素，但它不知道您希望將它添加到 DOM 中的哪個位置）。

如果您已經有一個Backbone.View並且想要將其設置為不同的元素，則可以使用setElement ，但在這種情況下，您也有責任確保該元素是DOM一部分。

如果 Backbone 給了你一種方法來指定元素在 DOM 中的位置，那看起來像：

{
  tagName: 'article',
   elPosition: '#container > .content+div:nth-child(3)'
}

同樣，會出現混淆，比如元素應該添加在elPosition之前還是之后等等。這看起來很難看，難怪為什么主干把它留給你而不是設置更多規則。 在我看來，與其他框架相比，backbone 設置的規則更少，給你更多的自由（當你不知道如何處理自由時，它會很痛苦:)

我們通常做的是，使用el選項讓主父view指向 DOM 中的包含元素，例如<body> 。

然后像this.$el.appendTo(parentView.$el);將子視圖附加到它this.$el.appendTo(parentView.$el);

Backbone.js - 向頁面呈現一個新元素

問題描述

1 個解決方案

解決方案1
1 已采納 2015-11-21 04:21:59

Backbone.js - 向頁面呈現一個新元素

問題描述

1 個解決方案

解決方案1 1 已采納 2015-11-21 04:21:59

解決方案1
1 已采納 2015-11-21 04:21:59