Backbone.js Сохранение дочерних переменных в родительских - PullRequest
Новая
       0

Backbone.js Сохранение дочерних переменных в родительских

1 голос
/ 24 февраля 2012

Как правильно сохранить унаследованную переменную при воздействии на родителя в Backbone.js? Я вижу некоторые логические способы сделать это, но они кажутся неэффективными и думают, что стоит спросить другое мнение.

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

1 Ответ

5 голосов
/ 24 февраля 2012

Я не уверен, что в вашем вопросе достаточно подробностей, чтобы ответить, но есть несколько способов сделать это:

  • Совместное использование общей модели. Когда вы описываете это, вы используете два представления для построения модели, поэтому, возможно, самый простой способ - передать саму модель дочернему представлению и получить дочерний вид изменяет модель, а не передает какие-либо переменные между представлениями: 

    var MyModel = Backbone.Model.extend({});

var ParentView = Backbone.View.extend({
    // initialize the new model
    initialize: function() {
        this.model = new MyModel();
    },

    // open the pop-up on click
    events: {
        'click #open_popup': 'openPopUp'
    },

    openPopUp: function() {
        // pass the model
        new PopUpView({ model: this.model })
    }
});

var PopUpView = Backbone.View.extend({
    events: {
        'change input#someProperty': 'changeProperty'
    },

    changeProperty: function() {
        var value = $('input#someProperty').val();
        this.model.set({ someProperty : value });
    }
});

  • Инициировать событие на родительском элементе. Если по какой-то причине вы не можете просто передать значение через модель, вы можете просто передать ссылку на родительский элемент и вызвать событие: 

    var ParentView = Backbone.View.extend({
    initialize: function() {
        // bind callback to event
        this.on('updateProperty', this.updateProperty, this);
    },

    updateProperty: function(value) {
        // do whatever you need to do with the value here
    },

    // open the pop-up on click
    events: {
        'click #open_popup': 'openPopUp'
    },

    openPopUp: function() {
        // pass the model
        new PopUpView({ parent: this })
    }
});

var PopUpView = Backbone.View.extend({
    events: {
        'change input#someProperty': 'changeProperty'
    },

    changeProperty: function() {
        var value = $('input#someProperty').val();
        this.options.parent.trigger('updateProperty', value);
    }
});
...