2

初めての Backbone Marionette アプリケーションを構築していますが、再利用可能な UI をビュー テンプレートに追加する方法がわかりません。これらの UI 要素には JavaScript の相互作用があります。

以下に示す入力要素のような多くの UI 要素を作成しました。この入力要素は、JavaScript を介して操作できます。たとえば、上向き矢印または下向き矢印をクリックして入力の値を変更します。

UI 要素

これらの UI 要素は複数のビューで何度も再利用する必要があり、これらの UI 要素の多くのインスタンスが任意のビューに含まれる可能性があります。いくつかの UI 要素を含む、そのようなビューの 1 つのモックアップを以下に示します。

UI 要素のグループ

このビューのモデルは次のようになります。このビューのモデルと相互作用する UI 要素の JavaScript 相互作用を実現したいと考えています。つまり、UI 要素の JavaScript インタラクションは、UI 要素が表示されるビューのモデルにイベントを渡すことができる必要があります。

var fontStyles = Backbone.Model.extend({
    defaults: {
        fontFamily: "Helvetica Neue",
        fontWeight: "Regular",
        color: "rbg(1,197,255)"
        ...
    }
});

私の質問

適切に構造化された Backbone Marionette アプリケーションの場合、これらの再利用可能な UI 要素とその JavaScript インタラクション メソッドを、すべてのビュー/モジュールで再利用できるようにどこで定義すればよいでしょうか?

別の問題として、これらの UI 要素の HTML を一度テンプレート ファイルに記述し、その単一の UI テンプレート ファイルをビューのアンダースコア テンプレートで何度も再利用することは可能ですか? または、すべてのビューのテンプレートで UI 要素の HTML を繰り返す必要がありますか?

質問が不明な場合はお知らせください。

4

1 に答える 1