Как правильно переключать классы в Ember Octane с помощью руля?

Question

Я хочу переключаться между включением и выключением отображения классов с помощью Ember.js Octane. Как мне это сделать? Мне нужно @action или @tracked?

<img src="flower.jpg" alt="flower" class="display-on">  
or
<img src="flower.jpg" alt="flower" class="display-off"> 

Answer 1

Это должно быть просто в Ember (особенно с функциями Octane).

Как упомянул @jrjohnson в комментарии, разметка зависит от того, как вы управляете способом отслеживания состояния, с помощью которого классы переключаются. В идеальном случае, так как вам нужно переключитьclass в одиночку вы можете визуализировать класс, используя условные выражения в шаблоне с помощью свойства JS Class, canShow:

<img src="flower.jpg" alt="flower" class={{if this.canShow "display-on" "display-off"}}> 

Вот, canShowдолжен быть @tracked (как вы упомянули), если вам нужно повторно отобразить представление (шаблон) при изменении его значения.

Надеюсь, вам нравится изучать Ember;)