javascript - Marionette 嵌入式事件访问 ui 哈希

Question

我尝试在 marionette 中嵌入事件处理，但我有点卡住了，因为当我嵌入事件时，我失去了 marionette View 对象，我需要更新 div 的宽度来创建交互式 slider 。

 SliderBehavior = Marionette.Behavior.extend({
    ui: {
        slider: '.slider-pointer',
        foregroundScale: '.slider-default',
    },

    events: {
      'mousedown @ui.slider': 'onSliderDrag'
    },

    onSliderDrag: function(e) {
      console.log(this);

      var handlers = {
          mousemove : function(e){
              this.ui.foregroundScale.css({
                  width : utility.round((this.view.options.max - (e.pageX - this.view.options.offset)), this.view.options.min, this.view.options.max)+ 'px'
              });
          },
          mouseup : function(e){
              $(e.target).off(handlers);   
          }
      };

      this.$el.on(handlers);
    }
  });

所以问题是 insde handlers >> mousemove >> 这个对象代表事件，我如何从这个函数内部访问我的 ui 哈希。

问候

Answer 1

快速回答使用 $.proxy 注入(inject)您自己的作用域

var handlers = {
      mousemove : $.proxy(function(e){
          this.ui.foregroundScale.css({
              width : utility.round((this.options.max - (e.pageX - this.options.offset)), this.options.min, this.options.max)+ 'px'
          });
      }, this),
      mouseup : $.proxy(function(e){
          $(e.target).off(handlers);   
      }, this)
  };