Перейти к содержимому

Как добавить переходы между страницами в Next.js 14 (включая анимацию выхода)

Tom Is Loading

0:00 / 0:00

Как добавить переходы между страницами в Next.js 14 (включая анимацию выхода)

87 084 просмотра · 2 года назад
Tom Is Loading
32,8 тыс. подписчиков
87 084 просмотра · 2 года назад
Анимированные компоненты пользовательского интерфейса для React, Tailwind CSS, Framer Motion и других ✨ https://www.hover.dev Сегодня мы рассмотрим, как создавать настраиваемые, гибкие переходы между страницами с помощью маршрутизатора приложений NextJS 14. Мы сделаем это без каких-либо сложных трюков с анимацией. Мы напишем код таким образом, чтобы его можно было повторно использовать и развивать, так что каждая из ваших страниц сможет выборочно анимироваться так, как вам нужно (включая полное отсутствие анимации!). 📚 Ссылки на проект Код: https://github.com/TomIsLoading/next-... 🔗 Мои ссылки TikTok:   / tomisloading   Instagram:   / tomisloading   GitHub: https://github.com/TomIsLoading Twitter:   / tomisloading   Discord и другие ресурсы: https://linktr.ee/tomisloading Шаблоны портфолио: https://tomisloading.gumroad.com/ Веб-сайт: https://www.hover.dev Таймлайн: 0:00 - Введение 0:23 - Обзор проекта 2:09 - Создание пользовательского компонента ссылки 4:01 - Предотвращение поведения ссылки по умолчанию 6:42 - Добавление нашей анимации