【问题标题】:Backbone fetch Data from Json骨干从 Json 获取数据
【发布时间】:2016-10-29 11:27:15
【问题描述】:

我是 Backbone 的新手。我正在尝试从骨干网中的json 获取数据。但它没有获取数据。尝试获取数据时进入错误函数。这是我的代码:

var Item = Backbone.Model.extend();
var List = Backbone.Collection.extend({
    model: Item,

    url: "form.json",

    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);
    }
});

var ListView = Backbone.View.extend({
    el: $('.deep-div'),
    events: {
        'click button#add': 'getPost'
    },
    initialize: function() {
        _.bindAll(this, 'getPost');
        this.collection = new List();
        this.getPost();
    },
    getPost: function() {
        var that = this;
        this.collection.fetch({
            success: function() {
                console.log(that.collection.toJSON());
            },
            error: function() {
                console.log('Failed to fetch!');
            }
        });
    }
});
var listView = new ListView();

而我的json

{
    "status": "SUCCESS",
    "statusMessage": "",
    "payload": [
        {
            "type": "text",
            "label": "Name",
            "currentValue": " ",
            "isRequired": "true"

        },
        {
            "type": "Date",
            "label": "DOB",
            "currentValue": " ",
            "isRequired": "true"
        }
    ]
}

【问题讨论】:

  • 我猜是因为你的解析函数:return response.results; 试试:return response.payload;
  • 你能显示你得到的错误吗?
  • @Eytibi 仍然存在问题

标签: javascript backbone.js


【解决方案1】:

不要在不知道自己在做什么的情况下重写 sync 方法。

只要 JSON 文件的路径正确,并且您通过 HTTP 服务器为应用程序提供服务并且不存在文件访问权限问题,那么以下操作即可。

var List = Backbone.Collection.extend({
  model: Item,
  url: "form.json",
  parse: function(response) {
    return response.payload;
  }
});

【讨论】:

  • 知道了,谢谢.. 现在你能告诉我何时覆盖同步。因为我的 json 可能来自跨域域。
  • @Master.Deep sync 被覆盖以改变所有方法(如fetchsavedestroy 等)与持久层交互的方式。对于 JSONP,只需传递选项以获取调用 *.com/a/9996420/2333214,或单独覆盖 fetch 方法,而不是整个 sync。顺便说一句,实现 CORS 是比 JSONP 更好的选择 *.com/a/7174902/2333214