Публикации по теме 'react-router'


React Router Простое руководство для начинающих
Что мы строим Ничего особенного, просто пример простого реактивного маршрутизатора. Если вы хотите увидеть окончательную версию кода, не стесняйтесь клонировать репо из github . Установить зависимости Вам понадобится установленный Node на вашем компьютере, но, поскольку вы читаете статью о React, я предполагаю, что вы это рассмотрели. Сначала мы воспользуемся react create app , чтобы настроить наш проект. npx create-react-app simple-router Это создаст наш новый..

Эксперимент по созданию приложения с нулевой зависимостью * React
(*) Нет redux, redux-react, response-router, react-router-dom, react-router-redux, redux-sagas или альтернативы React - очень популярная библиотека, которая воплощает мечту UI = f (state) в реальность. Но React - это просто библиотека пользовательского интерфейса, она определяет себя как «библиотека JavaScript для создания пользовательских интерфейсов» . Но это оставляет желать лучшего, поскольку большинству реальных приложений требуется маршрутизация, управление состоянием,..

Как реализовать базовый частный маршрутизатор в React Router Dom?
Всем привет, давно не было последней статьи. Сегодня мы научимся создавать приватную область с библиотекой React Router Dom. Я не собираюсь рассказывать вам все о React Router Dom с нуля, но вы поймете, как мы можем создать приватную область, которую могут видеть только зарегистрированные пользователи. Давай начнем. Готовим нашу структуру папок. Как вы можете догадаться, сначала нам нужно установить React Router Dom. yarn add react-router-dom or npm i react-router-dom..

Прощайте, useState и useEffect: революция в разработке React!
Многие разработчики продолжают использовать хуки useState и useEffect для обновления состояний, но мне такой подход не нравится. Проблема в том, что это приводит к одновременному монтированию, перемонтированию и размонтированию компонента, что приводит к неожиданному поведению. В результате при вводе чего-либо в консоль вы можете увидеть повторение результата три раза. Представляем хук useLoaderData: Хук useLoaderData — это пользовательский хук в React, который помогает вам загружать..

Модальное всплывающее окно входа — ReactJS, TypeScript Tutorial — #6 React Router v6 Multiple Modals
В этом выпуске я отвечаю на один из комментариев. Меня спросили, как отображать несколько модальных окон (логин, регистрация, забыл пароль). Я объединил это с React Router v6, чтобы увидеть, как связать все это вместе. Теперь вы можете легко отображать и управлять многими модальными окнами :)

Лучшие библиотеки маршрутизации React
Как вы, возможно, знаете, маршрутизация на стороне клиента является важным аспектом создания современных веб-приложений, поскольку она позволяет пользователям перемещаться между различными представлениями или страницами в рамках одностраничного приложения. Доступно несколько библиотек маршрутизации React, которые предоставляют мощные, гибкие и простые в использовании решения маршрутизации для ваших проектов. В этой статье мы обсудим четыре самые популярные библиотеки маршрутизации React,..

Как проверить динамические маршруты в React Router
Получить и проверить данные перед рендерингом компонента Исходный код: https://github.com/AbdelrhmanAmin/React-Dynamic-Routes-Manager Проблема: Чтобы проиллюстрировать проблему, возьмем, к примеру, профили пользователей. Я бы определил динамические маршруты с параметром users/:userId и отрисовал бы компонент профиля, а внутри компонента я бы получил userId из useParams , а внутри useEffect я бы сделал запрос на выборку, чтобы получить информацию о пользователе...