1

私はrequirejsでバックボーンを勉強し始めています

オンラインでいくつかのチュートリアルに従っていますが、少し疑問があります。
Json からデータをフェッチすると、コンソール ログにあまりにも多くの行が出力されます。json に 4 つの要素がある場合、4*4 要素が出力されます。
これは私のコードです:

コレクション：

define(['backbone', 'models/todo'], function(Backbone, TodoModel){

    var todoCollection = Backbone.Collection.extend({
        model: TodoModel,
        url:'json/todos.json',
        parse: function(data){
            return data.result;
        }
    });

    return todoCollection;
});

アプリ：

define(['jquery' , 'backbone', 'views/todo', 'models/todo', 'collections/todo'], 
    function($, Backbone, TodoView, TodoModel, TodoCollection){
    var AppView = Backbone.View.extend({

        el:$('#placeholder'),

        initialize: function(){
            console.log('initialize AppView');
            this.todos = new TodoCollection();
            this.todos.bind('all',this.render, this);
            this.todos.fetch();
        },
        render: function(){
            console.log('Data is fetched');
            this.todos.each(function(model){
                console.log(model.get("content"));
            });
        }
    })

    return AppView;
});

ジョンソン:

{
    "result":[
        {
            "content" : "Todo1"
        },
        {
            "content" : "Todo2"
        },
        {
            "content" : "Todo3"
        },
        {
            "content" : "Todo4"
        }
    ]
}

コンソールへの出力:

initialize AppView app.js:8
Data is fetched app.js:14
4
Initialized Todo model todo.js:7
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16

どうしてこんなに行列ができるの？次のような出力が期待されていました。

initialize AppView app.js:8
Data is fetched app.js:14
4
Initialized Todo model todo.js:7
Data is fetched app.js:14
Todo1 app.js:16
Todo2 app.js:16
Todo3 app.js:16
Todo4 app.js:16

要点がわかりません。誰かが私が間違っていることを説明できますか? ありがとう

4

1 に答える 1

3

あなたの問題はここにあります：

this.todos.bind('all',this.render, this);

this.render を数回呼び出すすべてのイベントにバインドしています。

代わりにこれを試してください：

this.todos.bind('sync', this.render, this);

または、さらに良い：

this.todos.on('sync', this.render, this);
于 2013-06-25T21:52:10.803 に答える