Как Новый React Router 6 решает все проблемы?
ฝัง
- เผยแพร่เมื่อ 27 ก.ย. 2024
- Разбираемся в преимуществах новой версии React Router 6. Из глобальных изменений:
1. Решена проблема порядка роутов с Route Ranking
2. Switch Переименован в Routes
3. Новый API Route
4. Вложенная маршрутизация
5. Index Route вернули
6. Новый хук useRoutes вместо react-router-config
7. Уменьшение размера: c 20kb до 8kb
Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка!
👉 Поддержка канала: / wisejs
✔️ Если хочешь изучать программирование со мной, не забудь подписаться :)
www.youtube.co....
✔️ Мой телеграм канал: t.me/joinchat/...
#reactrouter #reactrouterdom #reactrouter6 #реактроутер #реактроутердом #wisejs
Нужно видео с миграцией v5 на v6 или приложение с использованием React Router 6?
Ждем.
По любому
В доке же норм описано
@@АлексейФилиппов-в1ь не спорю)
нужно )
С каждым видео,контент становится более качественным,спасибо,что продолжаете нас приятно удивлять!👍👍👍👍👍👍👍👍👍👍
По первой проблеме: в 5 версии, чтобы route рендерился только при повторном совпадении path нужно добавить атрибут "exact"
Тоже не вижу в этом проблемы. Этот параметр изначально в 5ой версии был.
@@tuRistst какой блогер такой и контент
Это не решает той проблемы что роуты надо в правильном порядке расставить
@@yankov2206не соглашусь, контент очень хороший
Спасибо друг 🤝👍
Недавно столкнулся, когда изучал React.
Делал всё по видео, но там была v.5, а npm загрузил latest version.
В итоге пришлось чекать документацию и переписывать под v.6))
Лайк и подписка 🤘
Ура 🙌 новое видео. С возвращением! Да, было бы интересно посмотреть о миграции. Спасибо
разве exact не решает первую траблу?
Частично решает. В 6-й версии exact по дефолту = true.
Как всегда кратко понятно и по делу!!! :)
Спасибо,классное видео. React Router 6
спасибо за поддержку!)
как здорово ты разъяснил, спасибо
React-redux
REACT
React с нуля
Спасибо бро! помог
Спасибо, блага каналу
Как всегда, контент на высшем уровне! У тебя талант.
спасибо огромное!)
Бро го большой видос по nodejs (typescript) + react typescript , в Ютубе все делают на js(
Спасибо за подробный выпуск! Подобного контента очень не хватает
Спасибо за видео, последняя фича в целом вообще меняет сам подход использования роутов в приложении :)
Я не могу с них.... Во второй версии были адекватные иерархические руты. Надо было все сломать и подсадить всех на танцы с бубном, прокидывание путей, и запутанный рутинг внутри компонент. А сейчас "победоносно" возвращают то что работало 5 лет назад. И в этом весь фронтенд... Постоянные изменения и переписывание того что итак работает.
Это точно 😂
Как сами пишут: «Вернули все лучшее»
при чем тут фронтенд? это конкртено разрабы react-router такой фигней занимаются. В приличный обществах уже не рекомендуют вообще его использовать
@@Илья-с1л6э Редкая библиотека сохраняет свой апи и обратную совместимость на интервале 3-5 лет. При этом, будет делать +- то же самое.
@@Илья-с1л6э какую альтернативу предлагают юзать?
@@cartfpv4610 редкая библиотека ломает апи полностью с каждой версией. То есть прям полностью! Ни одна версия не была совместима с предыдущей. Это полный бред, и как по мне говорит о полном непонимании авторов, о том в какую сторону им двигаться.
Отличное видео, кратко и информативно
Спасибо огромное
На работе начали писать новую приложуху с нуля
Вообще нихера не понятно
Реально хоть и короткий видос но многое прояснил
Определенно лайк
кайф, спасибо
От души
Спасибо за ролик!
Привет! У тебя один из лучших каналов на ютюбе по js. Очень годный контент)))) Не забрасывай и к тебе придёт слава! Удачи!
///И много подписчиков тоже
Спасибо, приятно слышать)
Три минуты на "проблему", для которой предусмотрен атрибут "exact"... Ну, а для тех, кто не внимательно читает документацию, можно конечно тасовать строки кода...
3 минуты на проблему которую создали сами разрабы введя неочевидное API
@@wisejs
Это, как говорится, не баг, а фича.
Если бы стразу упомянуть об exact в 5-й версии, то и объяснение работы 6-й было бы проще - все роуты по умолчанию неявно содержат exact.
IMHO, просто и понятно для тех, кто хочет перейти с 5-й на 6-ю.
Спасибі!
Коли будуть нові відео? )
спасибо за видео!
Подскажи лучше как сделать multiPath как это было в 5 и в начале 6 роутера
как по мне, лично моё мнение 6 высер какой то, 5 лучше в разы, возможно что то со временем решится.
Ясно спасибо. Информативно и понятно
Про useSearchParams можете рассказать. Облегчает работу с query параметрами
Проблем не было. Проблем не решилось.
Единственное адекватное в новой версии это нестинг роута родителя.
Решалось и будет решаться через создание объекта константы routes где будут описаны все роуты приложения.
Чтобы не дублировать что-либо пишем рекурсивную функцию для генерации и отдыхаем
Вторая проблема немного вітянута за уши, как по мне. В 5 роутере можно и просто как children передавать контент роута, тогда не так уж и много кода и пропсі можно прокинуть
Color theme of IDE какая у вас?
Darcula Darker Theme
👌
Отличное видео, только не понял, как теперь 404 страницу рисовать?
path=“*”
Спасибо, а что сейчас вместо useHistory ? Откуда мы могли доставить хистори и делать разные пуши для переходов ?
useNavigate. Выглядит так:
const navigate = useNavigate()
navigate('/path')
useSearchParams перенял его часть функций
1) 10:43 это то же самое что и автоматический редирект с несуществующих роутов (типа '*') или нет? Если в адресной строке набрать рандомные числа, для которых мы не описали роут, нас будет перекидывать на компонент ?
2) 11:16 разве это не дублирование того, что ты говорил на 1:09 ?
1. В 6-й версии нас не будет перекидывать на Page т к роут не совпадет ибо exect сейчас как бы по дефолту true.
2. Не совсем, 1-й вариант задумывался о Route Ranking, второй о Index роутах.
Если можно выпусти видео как архитектурно грамотно использовать роуты 6й версии.
Получается я вовремя начал изучать реакт редакс... подогнали упрощения
А неет, до 3 минуты понимал потом не понял
😂 Так бывает, вернись к видео позже)
Привет, спасибо за инфу . Можешь показать как с этой новой версией сделать поисковик,
Что значит поисковик?)
@@wisejs ну как реализовать поиск по странице или живой поиск?
Го приложуху на новой версии)
Спасибо на Английский акцент)
спасибо, дядь, ждем
Нахрена тебе гитара? Ты что, что то смыслишь в музыке? Или ты играешь на гитаре так же как произносишь английские слова?
Короче реакт просто все слизал с vue )))
Реакт то тут при чем?) Реакт и Роутер разные люди пишут.
Почему реакт - это дичь?
А посмотрите на роутер!
Он изначально должен был такой быть! А не писать чепуху, а потом подпирать костыли костылями!
Вчера посмотрел твои видео по typescript , многое прояснилось
особенно с infer )
Круто! Рад, что помогло 🙃
проблема с V6 на TypeScript когда передаю компонент через Route, TS ругается на то что я не передаю пропсы
Слух режет, когда ты пытаешься выговорить "рендер", "компонент" с английским акцентом🥴говори как все. Не вые*уйся. Даже Минин так не вые*ывается, со своими то знаниями
я так понимаю ты так и не сделал гайд по миграции с 5 на 6?)
вроде как есть офф гайд, но он очень краткий, хотелось бы подробный разбор
На 6го версии мне очень понравилось Layout
Про Outlet чого не розповів?)
Супер! Лучшее, что я видел по рутам v.6
4:38, 4 рядок "text: string" як називається цей extension, дякую
Всі плагіни за замовчуванням. Який саме це допонює - не скажу. Версія WebStorm - 2021.3.1, Build #WS-213.6461.79, built on December 28, 2021
exact для кого?
spasibo
хотим
еще бы добавить 😊
Очень крутое видео, спасибо тебе огромное!!!
Отличный ролик. У парня талант рассказывать просто и с примерами 👍🏼 Лучше пока во всем интернете не видел
Спасибо за поддержку!
насколько же huevo ты искал хаххахах
Было бы интересно приложение на 6-й версии)
Лучший спасибо за ролики