骨干升级问题

时间:2012-03-13 20:09:46

标签: javascript jquery backbone.js

我正在从backbone.js 0.5.3升级到0.9.1而我遇到一个特定错误的问题就是回溯:

**Uncaught TypeError: object is not a function**
_.extend._prepareModel
_.extend.add
_.extend.reset
Backbone.Collection
child
Backbone.View.extend.render
(anonymous function)
Backbone.Events.trigger
stage.$el.stop.animate.complete
jQuery.extend.speed.opt.complete
jQuery.fx.step
t
jQuery.extend.tick

当我转到代码并研究它时,它似乎来自一个集合,但最后的错误点是:

// Prepare a model or hash of attributes to be added to this collection.
    _prepareModel: function(model, options) {
      options || (options = {});
      if (!(model instanceof Model)) {
        var attrs = model;
        options.collection = this;
        model = new this.model(attrs, options);
       /
      /
     /
   here:    Uncaught TypeError: object is not a function



        if (!model._validate(model.attributes, options)) model = false;
      } else if (!model.collection) {
        model.collection = this;
      }
      return model;
    },

更新

根据要求,这里是步骤:

//from inside the collection (this object is actually coming in from elsewhere but 
var viewconfig ={
            id:"values-tab-panel",
            idprefix:"values-tab",
            classname:"tabpanel",
            items:[
                {
                    urlRoot:"/"+lang+"/values",
                    url:"someurl1"

                },
                {
                    urlRoot:"/"+lang+"/values",
                    url:"/someurl2"

                },
                {
                    urlRoot:"/"+lang+"/values",
                    url:"/someurl3",
                }
            ]}
    this.view   = new TabPanelView(viewconfig); 

然后在视图内:

render: function(args){
        // 
        /*
         * what needs to happen is that the first time the render is called it creates a jquery DOM object which
         * can then be manipulated hencforth, currently there's all kinds of javscript bits which relate to it but not
         * an actual piece of DOM. closure should deal with the rest of it but theres nothing which is assigned
         * 
         */
        if(!args)
        {
            //first render
            var nav             = $("<aside/>").addClass("tab-navigation").append("<ol/>").attr("role","navigation");
            var tabcontent      = $("<section/>").addClass("tab-panels");
            for(i = 0;i<this.views.length;i++)
            {
                $("ol",nav).append("<li><a rel='"+this.views[i].id+"' href='javascript:;' class='tab-nav'></a></li>");
                tabcontent.append(this.views[i].el);
            }
            this.$el.empty().append(nav).append(tabcontent);
            //this.$el.append("<aside class='tab-navigation' ><ol role='navigation'>"+listhtm+"</ol></aside>")
            //this.$el.append("<section class='tab-panels'>"+innerhtm+"</section>");

            this.attach();
        }
        else if(args && args.update == true){
            // partial render -- i.e. update happening

            this.container = $(this.id);
            var targetid = args.what.cid;
            for(i = 0;i<this.views.length;i++)
            {
                var curcontent  = this.$el.find("div#"+this.views[i].id);
                var curlink     = this.$el.find("a[rel='"+this.views[i].id+"']")
                if(this.views[i].cid == targetid)
                {
                    curcontent.html($(this.views[i].el).html());
                    curlink.text(this.views[i].model.rawdata.header);
                }
                if(i>0)
                {
                    // set the first panel 
                    curcontent.addClass("tab-content-hide");
                }
                if(i==0)
                {
                    curcontent.addClass("tab-content-show");
                    curlink.addClass("tab-nav-selected");
                }
                //$("a[rel='"+this.views[i].id+"']").die().unbind().live("mousedown",this.switchtabs);// dont ask 
                log("a[rel='"+this.views[i].id+"']")
            }

            this.update();
        }
        return this;
    },

1 个答案:

答案 0 :(得分:1)

我仍然不能完全确定这是否正确,因为它已经删除了我的错误,并使事情进展顺利。

似乎Backbone 0.9.x已经使它无法在你的Collection的model函数中设置initialize。对我来说错误是在骨干0.5.x中我可以这样做:

var mycollection = Backbone.Collection.extend({
    initialize: function(args)
    {
        this.model = new mycollectionmodel();
                //some stuff
        }
});
var whatever = new mycollection();

然而在主干0.9.x中我必须这样做:

var mycollection = Backbone.Collection.extend({
        model: mycollectionmodel,
    initialize: function(args)
    {
        //some stuff
        }
});
var whatever = new mycollection();

或者这个:

var mycollection = Backbone.Collection.extend({
    initialize: function(args)
    {
        //some stuff
        }
});
var whatever = new mycollection({model:new mycollectionmodel()});

但是第一个抛出错误......