1

我开始用 requirejs 研究 Backbone

我在网上学习了一些教程，现在我有点怀疑。
当我从 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 回答