Ember JS嵌套組件冒泡

Question

我在這里創建了這個問題的小提琴： http : //jsfiddle.net/jcarmichael/gFTPN/2/

我已經用Ember JS應用程序嵌套了組件。

當在特定組件上觸發事件時，該事件將其動作發送到下一個組件，然后依次將動作發送到控制器。

在組件事件期間，它會修改值，這反映在下一個組件和控制器的更改中。

問題在於，僅在事件冒泡之后，對值的更改才出現在下一個組件和控制器上。 由於在控制器中我正在保存模型，因此這意味着將使用過期值保存模型。

這個問題似乎與此類似： Ember：嵌套組件事件冒泡

我嘗試如圖所示將targetObject添加到組件，但這似乎無法解決。

App = Ember.Application.create();

App.ApplicationController = Ember.Controller.extend({
    value : 1,

    actions : {
        controllerAction : function() {
           // Value shown here is 1, even though it was incremented by the component below
           alert('Value is ' + this.get('value'));   
        }
    }
});

App.Com2Component = Ember.Component.extend({
    value : null,

    actions : {
        sendMe : function() {
          this.sendAction();
          return false;
        }
    }
});

App.Com1Component = Ember.Component.extend({

    value : null,

    click : function() {
       // Increment the value
       this.set('value', this.get('value')+1);  
       this.sendAction();
       return false;
    }
});

Answer 1

我不確定您為什么會遇到這種行為，但是我猜想Ember會立即傳播事件/動作，並在runloop有機會運行並傳播對綁定值的更改之前立即運行其代碼。

一種解決方案： http : //jsfiddle.net/a2XUY/

   self = this;
   Ember.run.scheduleOnce('afterRender', function(){self.sendAction()});

我已經將sendAction包裝在Ember.run.scheduleOnce中，這意味着它僅在下一個runloop有機會通過應用程序傳播屬性更新后才運行。

更多參考： http ： //emberjs.com/guides/understanding-ember/run-loop/

Answer 2

解決此問題的一種方法是將this.get('value') + 1作為參數傳遞給this.sendAction()調用。 本質上，點擊功能變為

click: function() {
  this.sendAction(this.get('value') + 1);
}

因此，在保存模型之前，操作會冒泡保持所需的參數。