2017-11-21 7 views
1

関数を使用して、どの子ビューをマリネットでレンダリングするかを決める方法がわかりません。ここでのドキュメントに基づいて非常に単純でなければなりませんように思える:私はchildViewを定義するための関数を使用して収集し、複合ビューhttps://marionettejs.com/docs/master/marionette.compositeview.html#compositeviews-childviewビュー・マリネットを条件付きでレンダリングできません

のための同じであるべきであることが推論複合ビューのドキュメントからそのページを見つけ

https://marionettejs.com/docs/master/marionette.collectionview.html#collectionviews-childview

しかし、次のコードでは、「Uncaught TypeError:view.onは関数ではありません」というエラーメッセージが表示されます。私のコードは以下の通りです:

var Backbone = require('backbone'); 
var Marionette = require('backbone.marionette'); 

var ToDoModel = require('./models/todo'); 

var ToDo = Marionette.LayoutView.extend({ 
    tagName: 'li', 
    template: require('./templates/todoitem.hbs') 
}); 


var TodoList = Marionette.CompositeView.extend({ 
    el: '#app-hook', 
    template: require('./templates/todolist.html'), 

    childView: function(item) { 
    return ToDo; 
    }, 
    childViewContainer: 'ul', 

    ui: { 
    assignee: '#id_assignee', 
    form: 'form', 
    text: '#id_text' 
    }, 

    triggers: { 
    'submit @ui.form': 'add:todo:item' 
    }, 

    collectionEvents: { 
    add: 'itemAdded' 
    }, 

    modelEvents: { 
    invalid: 'itemInvalid' 
    }, 

    onAddTodoItem: function() { 
    this.model.set({ 
     assignee: this.ui.assignee.val(), 
     text: this.ui.text.val() 
    }); 

    if (this.model.isValid()) { 
     var items = this.model.pick('assignee', 'text'); 
     this.collection.add(items); 
    } 
    }, 

    itemAdded: function() { 
    this.model.set({ 
     assignee: '', 
     text: '' 
    }); 

    this.ui.assignee.val(''); 
    this.ui.text.val(''); 
    }, 

    itemInvalid: function() { 
    console.log('this item is invalid!') 
    } 

}); 


var todo = new TodoList({ 
    collection: new Backbone.Collection([ 
    {assignee: 'Scott', text: 'Write a book about Marionette'}, 
    {assignee: 'Andrew', text: 'Do some coding'} 
    ]), 
    model: new ToDoModel() 
}); 

todo.render(); 

なぜToDoビューは表示されませんか?

+0

[MCVEを記載してください]実行可能なスタックスニペットを使用します。 –

答えて

3

古いバージョンのMarionette(バージョン3では、LayoutViewが削除されたなど)を使用していて、最新バージョン(現在は3.5.1)のドキュメントを参照しているように見えます。

代わりにあなたがそう getChildView

を使用する必要があり、あなたのコードの関連部分がどのように見えるべきでマリオネット、childViewの古いバージョンでは

機能がサポートされていないとして、:

var TodoList = Marionette.CompositeView.extend({ 
    ... 
    getChildView: function(item) { 
    return ToDo; 
    }, 
    ... 
}); 
関連する問題