沒有創建獨特的模型？ Backbone.js

Question

我遇到了backbone.js模型的問題。我有一種觀點，即創建另一個視圖，並在其中創建一個新模型。但所有的觀點似乎都是參考相同的模型。下面是一些代碼。

DesignView

menu: function(ev) { 
     var menu = new MenuView({}); 
     console.log(menu); 
     ev = this.relativeEvData(ev); 
     menu.model.set('x',ev.relX); 
     menu.model.set('y',ev.relY); 
     this.$el.append(menu.render().el); 
     menu.addItem("cut","cut"); 
     console.log('click'); 

    } 

MenuView

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'text!templates/menuItem.html', 
    'models/menuModel' 
    ], function($, _, Backbone, MenuItemTemplate, MenuModel){ 
    var MenuView = Backbone.View.extend({ 

    //... is a list tag. 
    tagName: "ul", 
    model: new MenuModel({}), 
    // Cache the template function for a single item. 
    template: null, 
    // The DOM events specific to an item. 
    events: { 

    }, 

    initialize: function() { 
     _.bindAll(this, 'render'); 
     this.model.bind('change', this.render); 
     this.$el.addClass("contextMenu"); 
     this.$el.css('display','block'); 


    }, 

    // Re-render the contents of the todo item. 
    render: function() { 
     console.log(this.model); 
     this.$el.html(this.model.get('items').join('')); 
     //update position 
     this.$el.css('top',this.model.get('y') + 'px'); 
     this.$el.css('left',this.model.get('x') + 'px'); 

      return this; 
    }, 


    addItem: function(name,type) { 
     var items = this.model.get('items'); 
     items.push('<li class="' + type + '"><a href="#' + type + '">' + name + '</a><li>'); 
     this.model.set('items', items); 
     this.render(); 
    }, 


    // Remove the item, destroy the model. 
    clear: function() { 
     this.model.clear(); 
    } 
    }); 
     return MenuView; 
}); 

MenuModel

define(['underscore', 'backbone'], function(_, Backbone) { 
    var MenuModel = Backbone.Model.extend({ 

// Default attributes for the todo. 
defaults: function() { 
     return { 
      items:[], 
      x:0, 
      y:0 

     }; 

}, 

// nothing to initialize yet 
initialize: function() { 
}, 

// Remove this Todo from *localStorage*. 
clear: function() { 
    this.destroy(); 
}}); 
return MenuModel; 
}); 

所有MenuViews結束訪問相同的模型。我在這裏犯了什麼錯誤？

謝謝你的幫助。

Answer 1

你是使用相同的模型。

跳過您的MenuView中的model: new MenuModel({}),。

在DesignView而不是

var menu = new MenuView({}); 

你應該創建你的模型，並將其傳遞給視圖，即

var model = new MenuModel(), 
    menu = new MenuView({model: model});