Pourquoi dois-je utiliser Underscore.js _.méthode de liaison pour Backbone.js les événements personnalisés?

var DocumentEventsView = Backbone.View.extend({
  initialize : function () {
    $(document).on('visibilitychange', _.bind(this.onVisibilityChange, this));
  },  
  onVisibilityChange : function () {
    console.log('inside onVisibilityChange');
  }
});

Alors pourquoi ne peux pas je viens de faire $(document).('visibilitychange', 'onVisibilityChange' ?

Je sais que la méthode de liaison est de conserver et de transmettre le contexte de la méthode, mais je n'ai pas de soins sur le contexte, je ne suis jamais à l'aide de cette onVisibilityChange. Pourquoi $(document).('visibilitychange', 'onVisibilityChange" ne fonctionne pas?

ensuite, vous n'avez pas besoin de le faire. Si vous n'avez pas besoin de contexte, vous n'avez pas besoin de les lier. Mais alors, est-il besoin d'être une méthode de vue?
Il ne fonctionne pas si je ne suis pas à l'engager et, où placeriez-vous le gestionnaire d'événement?

OriginalL'auteur | 2013-10-24

  1. 7

    De cette façon, le this objet à l'intérieur de onVisibilityChange sera votre point de vue de l'objet.

    Si vous n'en avez pas besoin, alors n'utilisez pas _.bind. Le seul problème est que vous devez être très prudent lorsque, plus tard, vous changez d'avis et d'utiliser this à l'intérieur de onVisibilityChange: vous aurez une bonne chance d'oublier que this ne fait pas référence à l'objet d'affichage, et d'introduire une certaine divertissant un bug dans votre code.

    Ici est un exemple de travail, avec et sans _.bind:

    var  MyView1 = Backbone.View.extend({
        initialize: function () {
            $(document).on('click', _.bind(this.onClick, this));
        },
        onClick: function () {
            console.log('inside onClick, "this" is ' + this.toString());
        },
        toString: function () {
            return "[object MyView1]";
        }
    }),
    myView1 = new MyView1(),
    MyView2 = Backbone.View.extend({
        initialize: function () {
            $(document).on('dblclick', this.onDblClick);
        },
        onDblClick: function () {
            console.log('inside onDblClick, "this" is ' + this.toString());
        },
        toString: function () {
            return "[object MyView2]";
        }
    }),
    myView2 = new MyView2();

console.clear();
$(document).click();
$(document).dblclick();

    De sortie:

    inside onClick, "this" is [object MyView1]
inside onDblClick, "this" is [object HTMLDocument]

    J'ai utilisé click et dblclick événements pour des raisons de simplicité. La sortie est écrite à la console, appuyez sur la touche F12. Testé dans le dernier Chrome.

    Mais il ne fonctionne pas lorsque je n'utilise pas _.lier :/. C'est mon problème. Je reçois un jQuery erreur.
    TypeError: 'undefined' est pas une fonction (evaluationg '((x.de l'événement.spécial[o.origType]||{})de la poignée|du|o.gestionnaire).appliquer(j'.elem.a)")
    Cela fonctionne pour moi: $(document).on('visibilitychange', this.onVisibilityChange);
    Ah oui, j'ai été faire "onVisibilityChange', au lieu de cela.onVisibilityChange. Je pensais que cela a fonctionné comme des événements où vous pourriez juste donner la méthode à l'intérieur ".

    OriginalL'auteur kol

  2. 4

    Si vous utilisez la colonne vertébrale, vous ne devriez pas la peine de l'utilisation de jQuery. Essayez ceci:

    initialize: function() {
    this.on('visibilityChange', this.onVisibilityChange);
},
    Votre exemple ne fonctionne que si el était le document. De mon point de vue a un élément personnalisé.
    C'est la méthode par défaut de la colonne vertébrale pour écouter des événements indépendamment de ce que votre point de vue est (ou el). En fait, il travaille sur des Modèles aussi bien qu'ils s'étendent à partir de l'Événement.
    Vous avez raison, désolé.
    En fait, tant pis, il ne fonctionne pas :/. Et il est logique, sur quels éléments êtes-vous à la liaison de la visibilityChange événement?

    OriginalL'auteur EmptyArsenal

  3. 0

    Si vous ne voulez pas utiliser de _.lier ensuite de ne pas l'utiliser, et si vous avez des problèmes à résoudre d'une autre manière.

    at = this;
$(document).on('visibilitychange', function(){at.onVisibilityChange();});

    Ce _.lier n'est tout simplement enrouler fonction à une autre fonction, dans cette fonction suffit d'appeler la fonction originale avec de contexte spécifié.

    Modifier :

    $('selector').on('event',func) appelle la fonction avec le contexte de $('selector')[0] (élément du DOM).

    OriginalL'auteur KiT O