2

ここ数週間マリオネットと MVC アーキテクチャ全般を読んだ後でも、View in MV* が実際に何をすべきかはまだわかりません。私が読んだすべてのコード サンプル、ブログ投稿、またはチュートリアルでは、さまざまな量のロジックがビューに配置されているか、基本的に非推奨の.onイベント処理が使用されています。

私の直感では、Model がデータを保持し、View がイベントを起動し、Controller がそれらのイベントをリッスンして処理することがわかりました。奇妙に聞こえるかもしれませんが、できるだけ多くのロジックをビューから除外するように努めています。

例として、コントローラーで使用して、あるビューを別のビューに切り替えるだけのJSFiddleを作成しました.listenTo。レイアウトを使用してリージョンを切り替えることもできましたが、コードをできるだけ小さくしたかったのです。

私は正しい軌道に乗っていますか?ビューは、ビュー コード内でそれらのいずれにも作用せずに、インターフェイスを提示し、イベントを叫ぶだけでよいでしょうか? このロジックはコントローラにあるべきですか、それとも無駄のないコントローラを持つという原則から離れますか?

ありがとう。

詳細なコードは次のとおりです。

HTML

<script id="part1-template" type="text/template">
    <%= part1blurb %> <input type="button" id="goToPart2" value="OK" />
</script>

<script id="part2-template" type="text/template">
    <%= part2blurb %>
</script>

<div id="main"></div>

モデル

var MyModel = Backbone.Model.extend({
    defaults: {
        part1blurb: 'This is part one',
        part2blurb: 'This is part two'
    }
});

ビュー

var Part1View = Backbone.Marionette.ItemView.extend({
    model: new MyModel(),
    template: '#part1-template',
    triggers: {
        'click #goToPart2': 'part1:done'
    }
});

var Part2View = Backbone.Marionette.ItemView.extend({
    model: new MyModel(),
    template: '#part2-template'
});

コントローラ

var PageController = Backbone.Marionette.Controller.extend({
    _views: {
        part1: new Part1View(),
        part2: new Part2View()
    },
    initialize: function () {
        this.listenTo(this._views.part1, 'part1:done', function() {
            this._showPart(this._views.part2);
        });
    },
    start: function () {
        this._showPart(this._views.part1);
    },
    _showPart: function(view) {
        PageTest.mainRegion.show(view);
    }
});

アプリ

var PageTest = new Backbone.Marionette.Application();

PageTest.addRegions({
    mainRegion: '#main'
});

var controller = new PageController();

controller.start();
4

1 に答える 1