javascript - 複数のBackboneView$elを1つのjQueryオブジェクトにマージする

Question

これをDOMに表示したいと思います。

<body>
  <ul>
    <li>This is 1</li>
    <li>This is 2</li>
    <li>This is 3</li>
    <li>This is 4</li>
  </ul>
</body>

ulparentViewであり、lisubViewです。これが私がそれを機能させたい方法です：

parentViewは、例として単純なfor（）ループでsubViewを初期化して作成します。
addSubで作成された各subViewをレンダリングしたくないので、subViewのjQueryオブジェクト$elを返すだけです。
parentViewはこれらを保存$elし、などの単一のjQueryオブジェクトにマージします$new。これにはjQuery関数を使用.add()します。
次に、ループが完了したら、$newをDOMにレンダリングします。したがって、すべてがDOMの外部で発生する必要があります。

現在、私のコードは機能しません。何も表示されません。私は何を間違えましたか？

score 2 · Accepted Answer

ここでいくつか間違っています。ParentViewで、コードは次のようになります。

    for (i=1;i<=4;i++) {
        $new.add(this.addSub(i));
    }

    this.$el.html($new.html());

$new.add(this.addSub(i)).add（）の動作の性質上、保存されていません。この行を$new = $new.add(this.addSub(i));の行に沿ったものに変更する必要があります。それを機能させるために。

このアプローチを完全に使用することは避け、.appendを使用して各反復でliをulに追加することを検討することをお勧めします。

例this.$el.append(this.addSub(i))またはthis.$el.append(this.addSub(i).render().el)

繰り返しますが、.add（）を使用すると、になります$el.html($new.html())が、$ new自体が4つのli要素になるため、これは不要です。$new自体を次のように呼び出すことができます。this.$el.html($new);

最後に、parentViewに「ルート」要素を設定して削除するtagName: ul必要がありel: ulます。これは、サブビューを設定するための何かが必要なためです。

ここで動作するコードの更新されたjsfiddleは次のとおりです：http：//jsfiddle.net/SQFwg/

これから何かを取り除く場合は、.add（）を使用せず、代わりに.append（）を使用することです。

1 に答える 1