Компонент Ember.js (v2.4.5) не пропускает второе действие

У меня есть очень простой компонент, который имеет два действия: запуск и остановка. Они запускаются при нажатии кнопок. Первое действие всплывает на маршрут и работает, как и ожидалось, однако второе действие запускается в компоненте, но никогда не достигает маршрута.

Я только начал играть с Ember, но я предполагаю, что компоненты могут выполнять более одного действия?

Ошибок в консоли нет, кнопка просто ничего не делает и лог консоли с роута никогда не отображается.

Действия компонента

actions: {

  start() {
    console.log('component start called');
    this.sendAction('start', this.get('item'));
  },

  stop() {
    console.log('component stop called');
    this.sendAction('stop', this.get('item'));
  }
}

Маршрутные действия

actions: {
    start (server) {
        console.log('route start called');
        server.set("settings.amazonTask", 'start');
        server.save();
    },

    stop (server) {
        console.log('route stop called');
        server.set('settings.amazonTask', 'stop');
        server.save();
    }
}

Шаблон

<button type="button"
        class="btn btn-default btn-sm" {{action "start"}}>
    Turn on
</button>


<button type="button"
        class="btn btn-default btn-sm" {{action "stop"}}>
    Turn off
</button>

javascript ember.js ember-components
person Chris Turner    schedule 08.05.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вы должны передать действия своему компоненту:

{{my-component start=(action 'start') stop=(action 'stop')}}

И тогда вы можете позвонить тогда с sendAction.

Но я настоятельно рекомендую использовать новый синтаксис и напрямую обращаться к действиям над объектом attrs. Это намного яснее и проясняет, что происходит:

this.attrs['start'](this.get('item'))

На самом деле помощник action просто получает действие от объекта actions и привязывает его к текущему контексту. Результат этого может быть передан компоненту, а затем вызван оттуда, в контексте, где вы выполнили помощник action.

Обратите внимание, что вызов хелпера action для уже созданного действия не приведет к повторному выполнению действия, а просто передаст его.

person Lux    schedule 08.05.2016
comment
Это, конечно, сработало, я установил действие для запуска, но забыл действие для остановки. Я немного смущен остальной частью вашего комментария, хотя вокруг того, что вы рекомендуете, я действительно делаю. Не могли бы вы предоставить ссылку на документы/руководства или более подробный пример? - person Chris Turner; 08.05.2016
comment
Возможно, ознакомьтесь с исходным сообщением в блоге. . Я рекомендую не использовать sendAction, потому что это запутанное волшебство и обычно идентично this.attrs['action'](), который является четким вызовом функции, который также ясно дает результат. - person Lux; 08.05.2016