2015-10-14 2 views
1

У меня есть проект магистральной/марионеткой, структурированный с помощью требований.Все базовые модели инициализируются с использованием RequireJS

define([ 
    'views/FormView', 
    'path/to/Model', 
], function (FormView, Model) { 
    "use strict"; 

    return FormView.extend({ 

    model: new Model(), 

    /* --- rest of view stuff --- */ 

    }); 
}); 

Все модели в проекте инициализации (т.е. инициализации() будет вызываться на всех моделях) при загрузке страницы, но мнения только инициализируется, когда они инстанцируются контроллером.

Модели должны быть инициализированы только после их создания, и это вызывает у меня ряд головных болей.

Неужели кто-нибудь сталкивался с этим раньше?

Update:

благодаря Кевину и Юре за их ответы, этот код работает:

define([ 
    'views/FormView', 
    'path/to/Model', 
], function (FormView, Model) { 
    "use strict"; 

    return FormView.extend({ 

    model: undefined, 

    initialize: function() { 
     this.model = new Model(); 
    } 

    /* --- rest of view stuff --- */ 

    }); 
}); 
+0

В чем проблема? –

+0

mafoo, определяющий «неопределенное» свойство 'model', является хорошей идеей, как и в обновлении. Это определенно делает код более читаемым. – Yura

ответ

0

Ваша проблема заключается в том, что

model: new Model() 

работает, как только этот requirejs модуль загружен в браузер. То есть, когда это требуется, он возвращает расширенный FormView, и этот прототип используется для всех экземпляров FormView.

В это время создается экземпляр объекта экземпляра Model и этот экземпляр используется как свойство model каждого нового экземпляра FormView.

Что вы можете сделать, это вместо того, продлив FormView с model собственности непосредственно, делегировать что model создание экземпляра для инициализации FormView Например:

define([ 
'views/FormView', 
'path/to/Model', 
], function (FormView, Model) { "use strict"; 

    return FormView.extend({ 

    initialize: function(){ 
     /* Create property `model` whenever new instance of FormView is created */ 
     this.model = new Model(); 
    } 

    /* --- rest of view stuff --- */ 

    }); 
}); 

Вот полностью работающий пример, чтобы показать разницу:

/** EXAMPLE 1 ** 
 
    Directly extending with `model` property and assigning 
 
    new instance of `Model`. Later you find out same model 
 
    instance is used for all `MyView` instances. 
 
*/ 
 
var MyView = Backbone.View.extend({ 
 
    model: new Backbone.Model(), 
 
    render: function(){ 
 
    this.$el.text('I am ' + this.model.get('name')); 
 
    } 
 
}); 
 

 
var myView1 = new MyView(); 
 
myView1.$el.appendTo(document.body); 
 
var myView2 = new MyView(); 
 
myView2.$el.appendTo(document.body); 
 

 
myView1.model.set({name: "Joe"}); 
 
myView2.model.set({name: "Bob"}); 
 

 
myView1.render(); 
 
myView2.render(); 
 

 
/** EXAMPLE 2 ** 
 
    Extending with `model` in initialize will create and assign 
 
    new instance of `model` every time `MyOtherView` instance is created. 
 
*/ 
 
var MyOtherView = Backbone.View.extend({ 
 
    initialize: function(){ 
 
    this.model = new Backbone.Model(); 
 
    }, 
 
    render: function(){ 
 
    this.$el.text('I am ' + this.model.get('name')); 
 
    } 
 
}); 
 

 
var myView1 = new MyOtherView(); 
 
myView1.$el.appendTo(document.body); 
 
var myView2 = new MyOtherView(); 
 
myView2.$el.appendTo(document.body); 
 

 
myView1.model.set({name: "Alice"}); 
 
myView2.model.set({name: "Catrine"}); 
 

 
myView1.render(); 
 
myView2.render();
<script src='http://code.jquery.com/jquery.js'></script> 
 
<script src='http://underscorejs.org/underscore.js'></script> 
 
<script src='http://backbonejs.org/backbone.js'></script>

+0

Я пришел к тому же выводу об использовании инициализации fuction после прочтения ответа Кевина. – mafoo

0

Модели должны быть initalized только один раз они инстанцируются

Они быть, по определению.

Вы создаете экземпляр модели в определении класса выше, поэтому его инициализатор запускается при определении кода FormView. То, что вы, вероятно, хотите сделать, это передать модель в качестве опции при создании вид в контроллере, например:

var my_model = new Model(); 
var my_view = new FormView({model: my_model});