ここ数週間マリオネットと 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();