Новый синтаксис для события click в Handlebars / EmberJS - PullRequest
Новая
       23

Новый синтаксис для события click в Handlebars / EmberJS

0 голосов
/ 03 апреля 2020

Как мне переключиться с: 

 <Checkbox
   //do I need it to be @onclick?
   onclick={{action "toggleCheckBox" checkBox}}
 />

на: 

 <Checkbox
  {{on "click" this.toggleCheckBox "test"}}
 />

, если я не использую класс для моего контроллера: 

import Controller from '@ember/controller';

export default Controller.extend({
  actions: {
    toggleCheckBox(checkBox) {
      //code
    }
  }
})

1 Ответ

1 голос
/ 03 апреля 2020

Несмотря на то, что вы можете использовать новый синтаксис on в модели классов classi c с некоторыми изменениями синтаксиса, он лучше всего работает с синтаксисом собственного класса , поскольку привязка контекста была перемещена из {{action}} помощник для @action декоратора. Использование декоратора интуитивно понятно с синтаксисом класса Native.

1) По какой-то причине, если вам все еще нужно использовать модификатор on с моделью classi c ember, вы можете обернуть свою функцию с помощью action определение декоратора (декораторы в Ember полностью обратно совместимы) для привязки правильного this контекста к функции. В противном случае вы не сможете получить доступ к this внутри своей функции. 

import Controller from '@ember/controller';
import { action } from '@ember/object';

export default Controller.extend({
  toggleCheckBox: action(function(checkBox) {
    //code
  })
})

Однако приведенный выше фрагмент менее интуитивен по сравнению с фактическим синтаксисом собственного класса: 

import Controller from '@ember/controller';
import { action } from '@ember/object';

export default AppController extends Controller {
  @action
  toggleCheckBox(checkBox) {
    //code
  }
}

2) fn помощник должен использоваться для передачи аргументов обработчику при использовании модификатора on. 

<Checkbox
 {{on "click" (fn this.toggleCheckBox "test")}}
/>

Этот Twiddle должен помочь обойти синтаксисы. Вот руководство по обновлению для перехода от обработчиков событий classi c к новому синтаксису Octani sh. Объяснение Криса предоставляет подробное объяснение о новых синтаксисах.

...