Backbone.js 和 Require.js - Uncaught TypeError: Object function (){ return parent.apply(this, arguments);没有方法'on'

Question

我正在根据一些示例组合一个简单的待办事项列表应用程序来了解 Backbone。我在 Django 上为数据库运行代码并使用 Tastypie 来执行 API，并尝试使用 Backbone（对于 AMD 使用 RequireJS），但在我的控制台中遇到以下错误：

Uncaught TypeError: Object function (){ return parent.apply(this, arguments); } has no method 'on'

我认为我的应用无法通过骨干集合进行通信，因为它似乎在我的 app.js（主应用视图）中出现此错误：

// Bind relavent events to the todos.
this.listenTo(Todos, "add", this.addOne);
this.listenTo(Todos, "reset", this.addAll);

我在这里看到了一些类似的问题，但我只是闯入这些东西，所以对正在发生的事情的解释将不胜感激。

collections.js

define([
  'underscore', 
  'backbone',
  'app/app',
  'app/models/model'
], function(_, Backbone, app, Todo){

    // The collection of our todo models.
    TodoList = Backbone.Collection.extend({
        model: Todo,

        // A catcher for the meta object TastyPie will return.
        meta: {},

        // Set the (relative) url to the API for the item resource.
        url: "/api/item",

        // Our API will return an object with meta, then objects list.
        parse: function(response) {
            this.meta = response.meta;
            return response.objects;
        }
    });

    var Todos = new TodoList();
    return Todos;
});

app.js：

define([
  'jquery',
  'underscore', 
  'backbone',
  'app/models/model',
  'app/collections/collection',
  'app/views/view'
], function($, _, Backbone, Todos, Todo, TodoList, TodoView){

    // The view for the entire app.
    var AppView = Backbone.View.extend({
        el: "#todo-app",

        // Bind our events.
        events: {
            "keypress #new-todo": "createOnEnter",
        },

        initialize: function() {
            // TastyPie requires us to use a ?format=json param, so we'll
            // set that as a default.
            $.ajaxPrefilter(function(options) {
                _.extend(options, {format: "json"});
            });

            // Bind relavent events to the todos.
            this.listenTo(Todos, "add", this.addOne);
            this.listenTo(Todos, "reset", this.addAll);

            // Cache some of our elements.
            this.$input = this.$("#new-todo");

            // Get our todos from the API!
            Todos.fetch();
        },

        // Crate a new todo when the input has focus and enter key is hit.
        createOnEnter: function(event) {
            var keyCode = event.keyCode || event.which,
                title = this.$input.val().trim();

            // If we haven't hit enter, then continue.
            if (keyCode != 13 || !title) return;

            // Create a new todo.
            Todos.create({title: title, complete: false});

            // Reset the input.
            this.$input.val("");
        },

        // Add a single todo to the list.
        addOne: function(todo) {
            var view = new TodoView({model: todo});
            $("#todo-list").append(view.render().el);
        },

        // Clear the list and add each todo one by one.
        addAll: function() {
            this.$("todo-list").html("");
            Todos.each(this.addOne, this);
        }
    });
    return AppView;
});

Answer 1

你的app.js文件中定义和参数的顺序不对，你可以这样试试：

define([
  'jquery',
  'underscore', 
  'backbone',
  'app/models/model',
  'app/collections/collection',
  'app/views/view'
], function($, _, Backbone, Todo, Todos, TodoView){