我正在尝试使用backbones.js fetch从Twitter搜索获取json
我的代码可以告诉我哪里出错了?
(function($){
var Item = Backbone.Model.extend();
var List = Backbone.Collection.extend({
model: Item,
url:"http://search.twitter.com/search.json?q=blue%20angels&rpp=5&include_entities=true&result_type=mixed"
});
var ListView = Backbone.View.extend({
el: $('#test'),
events: {
'click button#add': 'getPost'
},
initialize: function(){
_.bindAll(this, 'render', 'getPost');
this.collection = new List();
this.render();
},
render: function(){
var self = this;
$(this.el).append("<button id='add'>get</button>");
},
getPost: function(){
console.log(this.collection.fetch());
}
});
// **listView instance**: Instantiate main app view.
var listView = new ListView();
})(jQuery);
我刚刚开始使用骨干网,我只想在console.log中使用json
你可以在这里看到我的例子。 jsfiddle.net/YnJ9q/2 /
答案 0 :(得分:5)
上面有两个问题:
首先,您需要向fetch方法添加成功/失败回调,以便将获取的JSON记录到控制台。
getPost: function(){
var that = this;
this.collection.fetch(
{
success: function () {
console.log(that.collection.toJSON());
},
error: function() {
console.log('Failed to fetch!');
}
});
}
另一个问题是“同源政策”问题。您可以通过查看this link了解如何解决这个问题。
<强>更新强>
我修改了您的代码并包含了更新的sync
方法。它现在有效! Take a look here!
基本上,更新您的collection
以包含parse
和sync
方法,如下所示:
var List = Backbone.Collection.extend({
model: Item,
url: "http://search.twitter.com/search.json?q=blue%20angels&rpp=5&include_entities=true&result_type=mixed",
parse: function(response) {
return response.results;
},
sync: function(method, model, options) {
var that = this;
var params = _.extend({
type: 'GET',
dataType: 'jsonp',
url: that.url,
processData: false
}, options);
return $.ajax(params);
}
});