Столкнулся со странными поведением при испльзовании exitBeforeEnter (mode='wait'). Вместо того, чтобы закончить одну анимации и начать другую, из dom пропадают все элементы списка кроме одного, у него проигрывается анимация, после чего появляется обновленный список с анимацией всех элементов %(
Чтобы ответить на вопрос о разнице, надо хорошо знать обе библиотеки. Касаемо реакт анимаций я работал с двумя библиотеками - framer-motion и react-spring. Framer-motion показался намного удобнее и функционал его намного шире. Я каждый месяц открываю для себя что-то новое, и библиотека стремительно развивается.
Вероятно разница в версиях. Ролик был записан относительно давно, в библиотеки могли произойти breaking changes. Здесь варианта два - изучать документацию, чтобы найти как то же самое делается сегодня, либо использовать ту же версию, что была актуальна 2 года назад.
Пипец какие велосипеды... А смысл??? Если бОльшую часть всей этой анимации можно элементарно сделать в CSS. Я уже молчу о том, что jQuery может делать по сути такие же эффекты, но с помощью всего одной команды. Я реально не понимаю, куда катится индустрия... К чему такое усложнение...
Прикольно, но коллапс кнопка явно не должна улетать вверх при появлении контента как здесь напр. 9:40, это bad ux. Открываешь так пункт faq и потом скроллишь вверх, чтобы его закрыть, а потом снова вниз, чтобы след. пункт прочитать и т.д. Явно не гуд. Как грится, надеюсь это не лажа в либе, а прост ведущий не донастроил.
Спасибо за труд, хорошая библиотека, хорошо показываешь, искал способ заставить элементы списка сдвигаться плавно после удаления, кажется нашел
Спасибо за объяснение))
Код стал чище
Спасибо за видео! Очень понравилась библиотека, а видео помогло быстро с ней разобраться!
Спасибо, попробую применить в проекте
Если что, в новой версии framer-motion вместо exitBeforeEnter используется mode="popLayout"
Ты лучшиЙ!!!!
Спасибо за видео! Очень помогло
Привет из 2023 ) давно хотел ппробовать ) было интересно
Спасибо
дякую, поміг чуваче
лайкос
Вроде бы на 11:19 не баг, а тип ease: ease-in по дефолту, а когда transition задаёшь, то все дефолтных настройки обнуляются.
Если у кого-то возникли трудности с exitBeforeEnter, то данное свойство устарело, его можно заменить другим - mode="wait"
Столкнулся со странными поведением при испльзовании exitBeforeEnter (mode='wait'). Вместо того, чтобы закончить одну анимации и начать другую, из dom пропадают все элементы списка кроме одного, у него проигрывается анимация, после чего появляется обновленный список с анимацией всех элементов %(
у меня одного не работает exitBeforeEnter? гугл пишет заменить на mode='wait', но так же выскакивает предупреждение в консоли.
API могло измениться с новыми версиями. Рекомендую обратиться к документации.
Так а в чём разница между Framer Motion и React Transition Group ?
И какой смысл писать анонимную функцию, которая вызывает другую функцию-обработчик?
Чтобы ответить на вопрос о разнице, надо хорошо знать обе библиотеки. Касаемо реакт анимаций я работал с двумя библиотеками - framer-motion и react-spring. Framer-motion показался намного удобнее и функционал его намного шире. Я каждый месяц открываю для себя что-то новое, и библиотека стремительно развивается.
Касаемо анонимной функции, без примера сложно ответить на ваш вопрос. Разумеется, контекст всех своих видео я не могу помнить.
очень помог бы разбор crossfade
exitBeforeEnter устарел и был заменен на mode="wait"
У меня у одного не работает ничего с учетом того, что я полностью все повторил?
Вероятно разница в версиях. Ролик был записан относительно давно, в библиотеки могли произойти breaking changes. Здесь варианта два - изучать документацию, чтобы найти как то же самое делается сегодня, либо использовать ту же версию, что была актуальна 2 года назад.
@@mishanep спасибо за совет.
9:10
Пипец какие велосипеды... А смысл??? Если бОльшую часть всей этой анимации можно элементарно сделать в CSS. Я уже молчу о том, что jQuery может делать по сути такие же эффекты, но с помощью всего одной команды. Я реально не понимаю, куда катится индустрия... К чему такое усложнение...
Если реакт компонент удаляется или добавляется на страницу, то с помощью css анимировать невозможно
Прикольно, но коллапс кнопка явно не должна улетать вверх при появлении контента как здесь напр. 9:40, это bad ux. Открываешь так пункт faq и потом скроллишь вверх, чтобы его закрыть, а потом снова вниз, чтобы след. пункт прочитать и т.д. Явно не гуд. Как грится, надеюсь это не лажа в либе, а прост ведущий не донастроил.
Так это зависит от того как ты скелет выстроил, библиотека тут вообще при чем?