webentwicklung-frage-antwort-db.com.de

So übergeben Sie Parameter an eine Ansicht

Ich habe eine Reihe von Schaltflächen, die beim Klicken ein Popup-Menü direkt unter der Schaltfläche anzeigen. Ich möchte die Position der Schaltfläche an die Ansicht übergeben. Wie kann ich das machen?

ItemView = Backbone.View.extend({
    tagName: 'li',
    events: {
        'click': 'showMenu'
    },
    initialize: function() {
        _.bindAll(this, 'render');
    },
    render: function() {
    return $(this.el).html(this.model.get('name'));
    },
    showMenu: function() {
        var itemColl = new ItemColl();
        new MenuView({collection: itemColl}); // how to pass the position of menu here?
    }
});
javascriptbackbone.js
93
vikmalhotra

Sie müssen nur den zusätzlichen Parameter übergeben, wenn Sie die Menüansicht erstellen. Die Funktion initialize muss nicht hinzugefügt werden.

new MenuView({
  collection: itemColl,
  position: this.getPosition()
})

Und dann können Sie in MenuViewthis.options.position Verwenden.

UPDATE: As @ mu ist zu kurz , seit 1.1.0 Backbone Views werden nicht mehr automatisch angehängt Optionen wurden als this.options an den Konstruktor übergeben, aber Sie können es auch selbst tun, wenn Sie es vorziehen.

Also können Sie in Ihrer initialize -Methode das options speichern, das als this.options Übergeben wurde:

initialize: function(options) {
    this.options = options;
    _.bindAll(this, 'render');
},

oder benutze einige feinere Möglichkeiten als beschrieben von @Brave Dave .

167
dira

Fügen Sie initialize ein Optionsargument hinzu:

initialize: function(options) {
    // Deal with default options and then look at options.pos
    // ...
},

Und geben Sie dann einige Optionen an, wenn Sie Ihre Ansicht erstellen:

var v = new ItemView({ pos: whatever_it_is});

Für weitere Informationen: http://backbonejs.org/#View-constructor

46
mu is too short

Ab Backbone 1.1.0 wird das Argument optionsnicht mehr angehängt automatisch zur Ansicht (siehe Ausgabe 2458 zur Diskussion). Sie müssen jetzt die Optionen jeder Ansicht manuell anfügen:

MenuView = Backbone.View.extend({
    initialize: function(options) {
        _.extend(this, _.pick(options, "position", ...));
    }
});

new MenuView({
    collection: itemColl,
    position: this.getPosition(),
    ...
});

Alternativ können Sie dieses Mini-Plugin verwenden, um Optionen auf der weißen Liste wie folgt automatisch anzuhängen:

MenuView = Backbone.View.extend({
    options : ["position", ...] // options.position will be copied to this.position
});
12
Brave Dave