Получить ссылку на компонент в AuraJS

Я использую jQuery dataTables для отображения таблицы. Мне нужно иметь возможность передать событие выбора строки моему компоненту Aura, который обрабатывает выбор и выполняет некоторые операции с данными из этой строки.

в initialize() функция:

initialize: function()
{
    $("#mytable tbody").click(function(event)
    {
      $(mytable.fnSettings().aoData).each(function ()
      {
        $(this.nTr).removeClass('row_selected');
      });

      $(event.target.parentNode).addClass('row_selected');
    });

    mytable = $('#mytable').dataTable();
},

Я установил обработчик щелчка для выбора строки, но как мне получить ссылку на включающий компонент, чтобы я мог sandbox.emit() функция для выдачи сообщений? Я могу поместить ссылку на компонент в замыкание, но это, по сути, делает этот компонент единичным, и у меня никогда не будет двух экземпляров компонента на странице одновременно.

Есть ли стандартный способ, используя селекторы jQuery или какой-либо другой метод, чтобы я мог получить ссылку на включающий компонент изнутри click() обработчик?

Изменить: я никогда не должен пытаться писать код, пока у меня не было 32 унции кофеина. Вы можете передать ссылку на текущий компонент через click() сам метод. Вот так:

$("#mytable tbody").click(this, function(event)
{
  $(mytable.fnSettings().aoData).each(function ()
  {
    $(this.nTr).removeClass('row_selected');
  });

  $(event.target.parentNode).addClass('row_selected');

  event.data.sandbox.emit('mychannel', {data: 'stuff'});
});

1 ответ

Если я правильно понимаю ваш вопрос, вы можете попробовать что-то вроде этого

initialize: function () {
   var that = this;
   $("#mytable tbody").click(function(event) {
      //have acces to component as 'that'    
   });
}

то, что я использовал для событий, это представление внутри конфигурации компонента:

View: {
        events: {
            'click a[data-question-edit-id]': function (e) {
                var button = $(e.currentTarget),
                    id = button.attr('data-question-edit-id'),
                    examId = this.component.examModel.get('id');

                this.sandbox.router.navigate('/exams/' + examId + '/questions/' + id + '/edit', {trigger: true});
            },
            'click a[data-question-delete-id]': function (e) {
                var button = $(e.currentTarget),
                    id = button.attr('data-question-delete-id');

                this.component.showDeleteConfirmation(id);
            }
        }
    }

Если вы найдете что-то полезное, вот мое репо проекта ауры, над которым я работаю: https://github.com/lyubomyr-rudko/aura-test-project

Другие вопросы по тегам