Backbone - 渲染集合

时间:2016-03-20 18:24:10

标签: javascript jquery json backbone.js

我试图用Backbonejs创建一个应用程序,这是我第一次使用前端Javascript框架,但JQuery除外。

我还没有理解渲染是如何工作的。

我的例子:



render: function() {


            var events = this.collection.fetch({

                success: function (model, response) {

                    console.log("Response is " + response);

                    var events = model.toJSON();

                    console.log(events.length);
                    console.log(model.toJSON());

                    return model.toJSON();

                },
                error: function(){
                    console.log("Errore during data fetch");
                }
            });


            this.$el.html(this.template({events:this.collection.toJSON()}));

            console.log("Event list: " + events.length);

},




上面的代码是我视图的渲染回调。 在成功集合提取中,我从我的API获取json格式的数据,并且我成功地将其记录在控制台上,但是在获取之外我不再拥有这些数据,并且我的视图集合似乎只是一个空的Backbone对象

有人可以解释我做错了什么以及渲染是如何工作的吗?

恩里科:)

1 个答案:

答案 0 :(得分:0)

嗯,render基本上只是将一些html代码注入到视图的el(元素)中。 可以使用模板引擎(例如handlebarsmustache)或仅使用通用主干(实际下划线)模板来完成,就像在代码中一样。

我们通常做的是将视图初始化为它所附着的模型或者在您的案例中收集的模型。 在render中获取数据不是一个很好的做法,因为它应该只使用已经获取的数据。

所以你能做的就是用这种方式初始化你的观点:

var View = Backbone.View.extend({
  initialize    :   function(){
    this.listenTo(this.collection, "change", this.render);
  },
  redner    :   function(){
    this.$el.html(this.template({events:this.collection.toJSON()}));
  }
});

在此代码中,视图侦听附加到其上的集合上发生的更改。当我说更改时,我的意思是更改集合中的任何模型,包括第一次获取集合的时间。 因此,只要您的集合发生更改,listenTo方法就会触发render方法,并且整个视图将重新呈现。 当第一次提取集合时,这显然会发生。

为了获取本身?一旦您将change事件绑定到视图,您就可以在应用中的任何位置获取它,而不一定在视图中。