骨干集合 - fetch() ，成功回调不起作用答案

【问题标题】：Backbone Collections - fetch() ,success callback not working骨干集合 - fetch() ，成功回调不起作用
【发布时间】：2014-03-15 02:19:47
【问题描述】：

我在 Backbone Js 中编码，这是我的代码：

var Router, UserList, Users, router, userList;

    $.ajaxPrefilter(function(options, originalOptions, jqXHR) {
      return options.url = "http://backbonejs-beginner.herokuapp.com" + options.url;
    });

    Users = Backbone.Collection.extend({
      url: '/users'
    });

    UserList = Backbone.View.extend({
      el: '#app',
      render: function() {
        var users;
        users = new Users();
        return users.fetch({
          success: function() {
            return console.log("Please log something!! ");
          }
        });
      }
    });

    userList = new UserList();

    Router = Backbone.Router.extend({
      routes: {
        '': 'home'
      },
      home: function() {
        console.log('Welcome home my friend!!');
        return userList.render();
      }
    });

    router = new Router();

    Backbone.history.start();

但是 collection.fetch() 中的成功回调不起作用。它没有记录任何东西！

这里是 JsFiddle：jsfiddle.net/9DjPY/1

请帮帮我！

【问题讨论】：

error 回调是否会尝试触发？
集合是否向服务器发送请求，因为它认为他们发送到无法到达的地方
是的，我正在取回数据！我检查了控制台。没有错误。我什至尝试了错误回调..仍然没有，
请提供jsfiddle demo，可以帮助调试）））
jsfiddle.net/9DjPY/1

标签： javascript backbone.js

【解决方案1】：

如果你想改变 AJAX 实现，Backbone 的方式是扩展他们的方法 Backbone.ajax 而不是改变 jQuery

视图应该返回自身而不是集合实例。此外，您可能应该听 add 或 reset，而不是听成功。

var Router, UserList, Users, router, userList,
    oldSync = Backbone.sync;
Backbone.ajax = function(options) {
    var args = Array.prototype.slice.call(arguments, 1);
    options || (options = {});
    if (options.url) {
        options.url = (/^https?/.test(options.url) ? '' : 'http://backbonejs-beginner.herokuapp.com') + options.url;
    }
    return Backbone.$.ajax.apply(Backbone.$, [options].concat(args));
};
Users = Backbone.Collection.extend({
  url: '/users'
});

UserList = Backbone.View.extend({
  el: '#app',
  initialize: function () {
      this.collection = new Users();
  },
  render: function() {
      this.collection.fetch({
          success: function () { console.log('Users', arguments) }
      });
      return this;
  }
});

userList = new UserList();

Router = Backbone.Router.extend({
  routes: {
    '': 'home'
  },
  home: function() {
    console.log('Welcome home my friend!!');
    return userList.render();
  }
});

router = new Router();

Backbone.history.start();

这是一个工作示例 - http://jsfiddle.net/hypernurb/9DjPY/5/。

希望这会有所帮助。

【讨论】：

【解决方案2】：

您的服务器端可能有问题，请尝试按照我在 fetch 中添加错误选项的位置：

UserList = Backbone.View.extend({
  el: '#app',
  render: function() {
    var users;
    users = new Users();
    return users.fetch({
      success: function() {
        return console.log("Please log something!! ");
      },
      error: function(){
        console.log(arguments);
        return console.log("Error log something!! ");
      }
    });
  }
});

【讨论】：