Добавлен Liquid Fire в проект Ember CLI, {{liquid-outlet}} ничего не делает

Question

Добавлен Liquid Fire в проект Ember CLI, {{liquid-outlet}} ничего не делает

Недавно я добавил Liquid Fire в свой проект Ember CLI 0.2.3, выполнив следующие шаги, описанные в этом руководстве: http://www.programwitherik.com/doing-animations-and-transitions-with-liquid-fire-and-ember/

Я добавил Liquid Fire с помощью npm install --save-dev liquid-fire. Я добавил файл transitions.js с кодом, изложенным в руководстве. Я заменил {{выход}} на {{выход жидкости}}. И ничего. Ничего не происходит. Нет ошибок в журналах или консоли, и ничего не отображается, где находится розетка. Я попробовал именно то, что говорит учебник. Я пропускаю шаг, чтобы заставить {{liquid-outlet}} работать?

6

ember-cli ember-cli-addons

Источник

user2561428 09 апр '15 в 22:59

3 ответа

Другие вопросы по тегам ember-cli ember-cli-addons

user4455533 12 май '15 в 19:02 2015-05-12 19:02 · Answer 1 · 2015-05-12 19:02

Я была такая же проблема. Моя проблема заключалась в том, что я не использовал правильные названия маршрутов.

Я включил ENV.APP.LOG_TRANSITIONS = true; вариант в /config/environment.js, Это печатает имена маршрутов в вашей консоли при переходе, что помогло мне написать правильные переходы в /app/transitions.js, Также не забудьте добавить {{liquid-outlet}} на ВСЕ ваши розетки при раскроении маршрутов.

Вот мой transitions.js файл:

export default function(){
    this.transition(
        this.fromRoute('dashboard'),
        this.toRoute('bots'),
        this.use('toLeft'),
        this.reverse('toRight')
    );

    this.transition(
        this.fromRoute('bots.bot'),
        this.toRoute('bots.create'),
        this.use('toLeft'),
        this.reverse('toRight')
    );

    this.transition(
        this.fromRoute('bots.bot'),
        this.toRoute('bots.index'),
        this.use('toRight'),
        this.reverse('toLeft')
    );

    this.transition(
        this.fromRoute('bots.bot.index'),
        this.toRoute('bots.bot.edit'),
        this.use('toLeft'),
        this.reverse('toRight')
    );

    this.transition(
        this.fromRoute('bots.bot'),
        this.toRoute('bots.bot.edit'),
        this.use('toDown'),
        this.reverse('toUp')
    );
}

user21075 12 апр '15 в 20:10 2015-04-12 20:10 · Answer 2 · 2015-04-12 20:10

Вы можете отладить ваши переходы, разместив this.debug() как последний аргумент в переходах, которые, по вашему мнению, должны совпадать. Для каждой розетки это выведет на консоль информацию о том, почему каждое правило перехода не совпадает.

Смотрите здесь: http://ef4.github.io/liquid-fire/

user9697317 08 май '19 в 19:14 2019-05-08 19:14 · Answer 3 · 2019-05-08 19:14

Перезапустите "ember serve". Откройте свой терминал, на котором работает ember serve. Наберите Ctrl+C и дождитесь окончания тлеющего угля. Снова введите "ember serve" и снова откройте свою веб-страницу ember (http://localhost:4200/). Работал у меня. Удачи!

0

Источник

user9697317 08 май '19 в 19:14

user1119331 13 дек '15 в 09:53 2015-12-13 09:53 · Answer 4 · 2015-12-13 09:53

Я была такая же проблема.

Я просто неуместна transitions.js в / вместо внутри /app/, Теперь все работает!

Вещи, которые вы можете попробовать:

Добавить явную анимацию в розетку {{liquid-outlet use="toLeft"}}, Если это работает, это, вероятно, ваш app/transition.js файл.
добавлять this.debug() в app/transition.js и посмотрите, правильно ли он записывает. Если да, то совпадают ли ваши маршруты? См пример
Обязательно заверните весь transitions.js файл в export default function() { ... };

Использование Ember CLI 1.13.13: