58 votes

Façon correcte de voir les mixins dans Backbone

J'étends les vues de base du squelette tout le temps et j'ai une vue de base par section pour pouvoir étendre à plusieurs niveaux. Ma question est la suivante: quel est le moyen le plus efficace de mixer des vues: des partiels de vue réutilisables pouvant être mélangés dans n’importe quelle vue. Par exemple:

 var BaseProfile = Backbone.View.extend({ ...});
var UserProfile = BaseProfile.extend({ ...});
var VideoSupport = Backbone.View.extend({ ...});
 

Quelle est la meilleure façon de mélanger la vue VideoSupport (un objet événement et quelques méthodes) avec la vue UserProfile ?

111voto

Derick Bailey Points 37859

La bibliothèque underscore.js fournit une méthode extend qui fait ce que vous voulez. Vous pouvez définir des fonctionnalités sur n'importe quel objet, puis copier et coller littéralement toutes les méthodes et tous les attributs de cet objet à un autre.

Les méthodes extend colonne vertébrale sur les vues, les modèles et les routeurs enveloppent les caractères de soulignement extend .

  var MyMixin = {
  foo: "bar",
  sayFoo: function(){alert(this.foo);}
}

var MyView = Backbone.View.extend({
 // ...
});

_.extend(MyView.prototype, MyMixin);

myView = new MyView();
myView.sayFoo(); //=> "bar"
 

19voto

Dan S Points 130

Je pourrais recommander d'utiliser Backbone.Cocktail, qui fournit un moyen très succinct de spécifier des mixins (qui respectent l'héritage):

 var Mixin = {
  initialize: function() {
    console.log("I'll be called as well as the class's constructor!");
  }
};

var View = Backbone.View.extend({
  mixins: [ MyMixin ]
});
 

Je l'ai détaillé dans ce blog .

3voto

user873792 Points 97

vous pouvez utiliser cet élément essentiel https://gist.github.com/3652964

2voto

Paul Alexander Points 17611

J'avais besoin de la capacité de l'emporter et d'appeler mixte dans les méthodes (ala super) de plus près à la façon dont ruby poignées de modules. Et la simple extension de la méthode tabasser le mixin méthode si elle était dans la classe. Depuis que je suis en train de construire tout en CoffeeScript, j'ai accès à la super objet qui me permet de cale méthodes. Il permettra également de fusionner automatiquement les événements de l'objet de sorte que vous pouvez définir des gestionnaires d'événements dans le mixin.

_.extend Backbone,
  mixin: (klass, mixin, merge) ->
    debugger unless mixin
    mixin = mixin.prototype || mixin
    merge ||= ["events"]

    sup = _.extend({},klass.__super__)

    for name,func of mixin      
      if base = sup[name] && _.isFunction(base)
        sup[name] = ->
          func.apply this, arguments
          base.apply this, arguments
      else
        sup[name] = func

    hp = {}.hasOwnProperty
    prototype = klass.prototype
    for name,func of mixin
      continue unless hp.call(mixin,name)
      continue if _(merge).contains name
      prototype[name] = func unless prototype[name]

    klass.__super__ = sup

    _(merge).each (name) ->
      if mixin[name]
        prototype[name] = _.extend({},mixin.events,prototype.events) 

    @

L'utilisation de la

class SimpleView extends Backbone.View
  events:
    "click .show" : "show"

  calculate: ->
    super + 5

  show: ->
    console.log @calculate()

class CalculatableViewMixin
  events:
    "click .calculate" : "show"

  calculate: ->
    15

Backbone.mixin SimpleView, CalculatableViewMixin

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X