Javascript jQuery Mobile,需要JS和主干REST收集示例

Javascript jQuery Mobile,需要JS和主干REST收集示例,javascript,jquery,json,jquery-mobile,backbone.js,Javascript,Jquery,Json,Jquery Mobile,Backbone.js,我在使用主干网、RequireJS方法和jQuery Mobile相结合方面是个新手。在官方的演示页面上,他们正在解析文件CategoriesCollection.js中的一个json数组示例。我想使用REST将此更改为现实世界的示例,我不知道如何实现这一点 CategoreCollection.js代码如下: // Category Collection // =================== // Includes file dependencies define([ "jq

我在使用主干网、RequireJS方法和jQuery Mobile相结合方面是个新手。在官方的演示页面上,他们正在解析文件CategoriesCollection.js中的一个json数组示例。我想使用REST将此更改为现实世界的示例,我不知道如何实现这一点

CategoreCollection.js代码如下:

// Category Collection
// ===================

// Includes file dependencies
define([
    "jquery",
    "backbone",
    "../models/CategoryModel" ], function( $, Backbone, CategoryModel ) {



    // Extends Backbone.Router
    var Collection = Backbone.Collection.extend( {

        // The Collection constructor
        initialize: function( models, options ) {

            // Sets the type instance property (ie. animals)
            this.type = options.type;

        },

        // Sets the Collection model property to be a Category Model
        model: CategoryModel,

        // Sample JSON data that in a real app will most likely come from a REST web service
        jsonArray: [

            { "category": "animals", "type": "Pets" },

            { "category": "animals", "type": "Farm Animals" },

            { "category": "animals", "type": "Wild Animals" },

            { "category": "colors", "type": "Blue" },

            { "category": "colors", "type": "Green" },

            { "category": "colors", "type": "Orange" },

            { "category": "colors", "type": "Purple" },

            { "category": "colors", "type": "Red" },

            { "category": "colors", "type": "Yellow" },

            { "category": "colors", "type": "Violet" },

            { "category": "vehicles", "type": "Cars" },

            { "category": "vehicles", "type": "Planes" },

            { "category": "vehicles", "type": "Construction" }

        ],

        // Overriding the Backbone.sync method (the Backbone.fetch method calls the sync method when trying to fetch data)
        sync: function( method, model, options ) {

            // Local Variables
            // ===============

            // Instantiates an empty array
            var categories = [],

                // Stores the this context in the self variable
                self = this,

                // Creates a jQuery Deferred Object
                deferred = $.Deferred();

            // Uses a setTimeout to mimic a real world application that retrieves data asynchronously
            setTimeout( function() {

                // Filters the above sample JSON data to return an array of only the correct category type
                categories = _.filter( self.jsonArray, function( row ) {

                    return row.category === self.type;

                } );

                // Calls the options.success method and passes an array of objects (Internally saves these objects as models to the current collection)
                options.success( categories );

                // Triggers the custom `added` method (which the Category View listens for)
                self.trigger( "added" );

                // Resolves the deferred object (this triggers the changePage method inside of the Category Router)
                deferred.resolve();

            }, 1000);

            // Returns the deferred object
            return deferred;

        }

    } );

    // Returns the Model class
    return Collection;

} );

请解释您希望实现什么样的“真实世界示例”。这是一个不好的示例,它们正在覆盖同步以提供本地对象-这不是一个好方法,通过谷歌搜索“mock api”或工具“mockjax”将揭示更好的方法。主干网本质上是处理实时数据的,他们通过覆盖同步来破坏它。任何关于模型主题的主干图坦卡门都会向你展示这一点。至于理想的设置,这是一个棘手的问题。我推荐我同事的首次回购-。至少我会扩展视图以支持子视图和多重继承的扩展方法。我只需要看看集合本身的逻辑如何,因为主干教程没有与RequireJS和jQuery Mobile结合的示例。因此,简而言之,在上面提供的示例中,我只需要看看如何通过REST检索JSON。