骨干轮询服务器进行更改 - 然后重新渲染?

时间:2013-08-01 18:01:06

标签: json backbone.js fetch backbone-views polling

我正在尝试使用Backbone从JSON API中提取日常事件,并定期检查JSON中的更改 - 并重新呈现这些更改。此外 - 应用程序将长时间运行,因此我将定期检查日期 - 以便在日期更改时,集合的URL也会更改,并且重新提取和重新呈现集合。

但是,当我重新获取数据时(无论是否已被修改或完全是新数据)---它不会在模型或集合上触发任何更改事件。

我可以粘贴我的代码 - 但它可以节省时间,只是简单地问:

在为服务器轮询新的/修改过的数据,然后在视图上添加/删除/更新模型的过程是什么?我不需要对服务器进行任何,只需要拉动内容 - 并且轮换30秒即可进行更改。

这会是同步吗?取?

我在网上搜索了相关的方法 - 但随着Backbone API的不断变化 - 到目前为止我还没有找到可行的解决方案。

感谢您的帮助!

3 个答案:

答案 0 :(得分:2)

首先:Backbone本身无法“定期”从API获取数据。您需要使用JavaScript处理它

回答你的每个问题:

Q值。轮询服务器获取新数据/修改数据,然后在视图上添加/删除/更新模型的过程是什么? 答:如上所述,您需要通过JS来处理,执行类似

的操作
setInterval(function(){
//Make an API call to get data
},30000);

Q值。我不需要对服务器进行任何写入操作,只需要拉动内容 - 并且可以在30秒内轮询更改。这是同步吗?取?

一个。我想说骨干提取方法是合适的。

每30秒进行一次API调用:

setInterval(function(){
  collection.fetch();
},30000);

听取提取完成并重新渲染视图

collection.on('reset',this.render(),this);

希望这能简单回答您的问题。

由于

答案 1 :(得分:1)

简单地说,每个Backbone组件都可以listenTotrigger个事件。有很多内置事件,但没有什么能阻止你实现自己的事件。

这是针对您的问题的纯事件驱动实施解决方案。这样做的优点是可以轻松扩展,如果您的应用程序中每30秒需要发生任何其他事情,那么只需将回调注册到正确的事件即可。

var Data = Backbone.Collection.extend({
  initialize: function() {
    this.listenTo( Backbone, 'tick:30secs', this.fetch, this );
    return this;
  },
  // Example date-dependent url.
  url : function() {
    var date = new Date(); 
    return 'http://server.com/api/' + date.getFullYear() + '-' + date.getDay();
  }
});

var View = Backbone.View.extend({
  // Assuming you store your template in the HTML page.
  template: _.template($('#view-template')),
  initialize: function() {
    this.listenTo( this.collection, 'reset change add', this.render, this );
    setInterval(function() { Backbone.trigger('tick:30secs'); }, 30000);
    return this;
  },
  render: function() {
    this.$el.html( this.template(this.collection.toJSON) );
    return this;
  }
});

// Start everything up.
var collection = new Data(),
    view = new View({ collection: collection });
$('body').append( view.el );
collection.fetch();

答案 2 :(得分:1)

backbone-poller似乎是一个很好的骨干实现。