Ember.js 1.13: Правильный способ наблюдения переданного атрибута компонента?

Question

Я пытаюсь обновить свой проект до Ember 1.13, и я немного смущен поведением нового attrsкомпонента, особенно когда я должен их соблюдать.

Например, мой тестовый компонент наблюдает бар, который является параметром, переданным снаружи. Я знаю, что в новом движке Emmer's Glimmer компонент перераспределяется после изменения любого его атрибута. Я не могу понять, что наблюдатель также будет уволен в это время, если я буду наблюдать attrs.bar (я не изменял bar!). Но если я наблюдаю бар, тогда все будет хорошо.

Пример кода:

HTMLBar:

{{test-cpnt foo=foo bar=bar}} 
<input type="button" {{action 'tap'}} value="tap"/> 

Контроллер:

foo: 1, 
bar: 100, 
actions: { 
    tap: function(){ 
    this.set('foo', this.get('foo')+1); 
    } 
} 

Компонент:

App.TestCpntComponent = Ember.Component.extend({ 
    barObv1: Ember.observer('bar', function(){ 
    console.log('bar observer is fired!'); 
    }), 

    barObv2: Ember.observer('attrs.bar', function(){ 
    console.log('attrs.bar observer is fired!'); 
    }), 
}); 

При нажатии на кнопку, чтобы изменить Foo, мы запустим barObv2. Я создал jsbin для демонстрации: https://jsbin.com/qiwivu/2/edit?js,console,output

Кто-нибудь знает, почему наблюдатель был запущен?

Answer 1

Ну, вам не нужно использовать наблюдателей, так как вы находитесь в Ember 1.13, вы можете использовать didUpdateAttrs, который запускается всякий раз, когда атрибут обновляется.

Ember.Component.extend({ 
.... 
didUpdateAttrs({oldAttrs, newAttrs}) { 
    let oldBar = get(oldAttrs, 'bar.value'); 
    let newBar = get(newAttrs, 'bar.value'); 

    if (oldBar !== new Bar) { 
     // your logic here 
    } 
} 
.... 
}); 

Если вы собираетесь использовать наблюдатель, вы можете наблюдать за изменениями как ниже

barDidChange: Ember.observer('bar', function(){ 
console.log('bar observer is fired!'); 
}); 

Прослушивание attrs.bar не будет работать должным образом, всякий раз, когда обновляется атрибут (в том числе инициализации), ATTRS мутируют каждый раз, заставляющий наблюдателей запускаться, для получения дополнительной информации см. here. attrs предполагается использовать с angle-bracket components. Вот хороший article, почему мы не должны использовать attrs для фигурных компонентов.