0

我创建了一个骨干模型，它从服务器获取 json。但是，我想在特定的时间间隔内使用新数据更新视图，而不是每次服务器发送数据时。我应该使用什么来每隔 n 毫秒更新一次主干视图？我有上面的代码。

    $(function() {


    var Profile = Backbone.Model.extend();

    var ProfileList = Backbone.Collection.extend({

                    model: Profile,
                    url: 'data.php'
    });   

    var ProfileView = Backbone.View.extend({

        el: "#profiles",
        template: _.template($('#profileTemplate').html()),
        render: function(eventName) {

        _.each(this.model.models, function(profile){
        var profileTemplate = this.template(profile.toJSON());
        $(this.el).append(profileTemplate);
        }, this);

            return this;

        }
    });

        var profiles = new ProfileList();    
        var profilesView = new ProfileView({model: profiles});

        profiles.fetch({reset: true});
        //profiles.bind('reset', function () { console.log(profiles); });
        profiles.bind('reset', function () {
                profilesView.render();
        });

      });
4

1 回答 1

1

一个简单的解决方案是：

profiles.fetch({reset: true});

setInterval(
  function() {
    profiles.fetch({reset: true});
  }, 1000 // Time in milliseconds
);

我不会说这是一个漂亮的解决方案，但我希望你能明白。据我所知，Backbone 中没有实现间隔提取或类似的东西——所以你几乎必须自己构建。

编辑

这可能是一个更好的解决方案，至少我更喜欢它。

var ProfileList = Backbone.Collection.extend({
  model   : Profile,
  url     : "data.php",
  xhr     : null,
  interval: null,

  fetchWithInterval: function(options) {
    var options = options || {},
        self    = this;

    this.interval = setInterval(function(){
      if(self.xhr !== null && self.xhr.readyState !== 4) {
        return;
      }
      self.xhr = self.constructor.__super__.fetch.apply(self, options);
    }, 1000);

    this.xhr = self.constructor.__super__.fetch.apply(self, options);
  },

  stopFetchWithInterval: function() {
    clearInterval(this.interval);
  }
});

使用它，profiles.fetchWithInterval({reset: true});你可以用 停止它profiles.stopFetchWithInterval()。

它还管理xhr，所以如果 AJAX 调用没有完成它不会启动一个新的。如果您想以较小的间隔进行获取，或者当您的 API 由于某种原因很慢时，这非常方便。

于 2013-10-09T12:53:22.767 回答