1

バックボーンとブートストラップを使用しています。ここでの私の目標は、動的に生成されたメモのリストで終了することです。メモのタイトルは左側の垂直に積み重ねられたタブ リストにあり、メモの内容は右側のタブ ペインにあります。

デモ用の簡単な HTML を次に示します。

<div class="row">
    <div class="col-md-2">
        <ul class="nav nav-tabs nav-stacked">
            <li><a href="#note1" data-toggle="tab">Note 1 Title</a></li>
            <li><a href="#note2" data-toggle="tab">Note 2 Title</a></li>
        </ul>
    </div>
    <div class="col-md-10">
        <div class="tab-content">
            <div class="tab-pane" id="note1">Here is note 1's content</div>
            <div class="tab-pane" id="note2">Here is note 2's content</div>
        </div>
    </div>
</div>

各ノートはバックボーン モデルです。上記のコレクションの HTML コンテンツの所有を担当する Notes ビューと、各 Note モデルのレンダリングを担当する Note ビューがあります。
問題は、各 Note モデルの必要な出力が、Notes ビューが所有する DOM の異なる部分 (タイトルとコンテンツ) にある HTML の 2 つの「セクション」で構成されていることです。

私の質問は、ノート ビューの render() メソッドが必要な HTML を返してタイトルとコンテンツの両方を表示できるようにするにはどうすればよいですか?

両方の項目を 1 つの戻り値で返すことができるとは思えません。また、'title' html と 'content' html の 2 つの要素を含む配列を返す必要があるかもしれません。これは、バックボーンでこの問題にアプローチする標準的な最良の方法ですか?

さらに読むための提案を感謝して受け取りました。

4

1 に答える 1

1

サブビューを使用するのではなく、単一のビュー (「NotesView」) を使用してこの全体をレンダリングすると、複雑さが軽減されます。各ノート要素を data-id または data-cid 属性に関連付けることができるため、関心のある何かが発生した (削除など) ときに、コレクションからイベント ハンドラーで適切なモデルを取得できます。次に、テンプレートで Notes コレクションの繰り返しを実行できます。

別の方法として、Note Model と View を 1 対 1 にしようとする必要はありません。あなたが提供した html に個別のビューが必要な場合は、「NoteTitleView」と「NoteContentView」のようなものが必要で、どちらもオプションで NoteModel を受け入れます。

于 2013-10-19T17:13:25.523 に答える