Публикации по теме 'react-router-dom'
Реагировать на хуки маршрутизатора
Речь идет об хуках useHistory, useLocation, useRouteMatch и useParams.
Самая популярная библиотека в React для обработки маршрутизации — React Router. С выпуском React 16.8 и React Hooks в React Router также появились хуки, упрощающие доступ к состоянию маршрутизатора и выполнение навигации.
В этой статье мы рассмотрим около 4 хуков, включенных в React Router API, которые включают следующее:
история использования использованиеМестоположение использование RouterMatch useParams..
до 14 февраля 2023 г.
Как работает useParams()
Миссия
Explain how const { id } = useParams() works.
Объяснение
Что делает useParams() )
Он извлекает динамические параметры из URL-адреса и делает их доступными в качестве свойств объекта. Затем этот объект возвращается из useParams() .
Например, если URL-адрес — /todos/123 , где 123 — динамический параметр, то вызов useParams() в компоненте, отображаемом маршрутом /todos/:id , вернет объект, подобный { id: "123" } .
Синтаксис..
Вопросы по теме 'react-router-dom'
Получение неопределенных компонентов в React Router v4
Только что обновился до react-router-dom 4.0.0 . Все мои компоненты либо обычные class es, либо толстые стрелки. Все они экспортируются с помощью export default ThatComponent . Тем не менее, я получаю это:
Неперехваченная ошибка:...
7378 просмотров
schedule
13.02.2023
React Router 4.x - PrivateRoute не работает после подключения к Redux
PrivateRoute доступен в примере https://reacttraining.com/react-router/web/example/auth-workflow не работает после подключения к Redux.
Мой PrivateRoute выглядит почти так же, как и исходная версия, но только подключен к Redux и использовал его...
7069 просмотров
schedule
22.07.2023
Невызванные компоненты продолжают просачиваться в другие компоненты [дубликаты]
Я пытался реализовать страницу 404 в React Redux, как описано в этой статье. . Мои маршруты следующие:
import React from "react";
import {Provider} from "react-redux";
import {ConnectedRouter} from "react-router-redux";
import {Route} from...
18 просмотров
schedule
12.02.2024
Передача параметров из ссылок в компоненты - react-router-dom
Я пытаюсь создать страницу профиля, на которой отображается информация о пользователе.
Маршрут - localhost: 3000 / profile /, и я хочу предотвратить отображение идентификаторов пользователей в URL-адресе.
Пример: вместо localhost: 3000 / profile...
1076 просмотров
schedule
12.12.2023
response-router не работает в производственной среде и при импульсном развертывании
Мое приложение для реагирования нормально работает на localhost, но когда после того, как я развернул его на gh-страницах или увеличился, он не дает мне перемещаться между страницами с использованием URL-адреса.
Это ссылка на репозиторий...
25181 просмотров
schedule
15.12.2022
передача параметров через react-router
У меня есть код, который отображает четыре изображения, и когда одно изображение щелкается из них, оно занимает весь экран. Я использую реагирующий маршрутизатор для реализации того же самого. Код похож на этот App.js
import React from 'react';...
1873 просмотров
schedule
28.10.2022
Как передать компоненты контейнера в маршрут react-router-dom?
В настоящее время у меня проблема с машинописным текстом с передачей правильного типа в React Router Redux.
машинописная ошибка:
severity: 'Error'
message: 'Type '{ path: "/foo/:id"; component: typeof "<path>..' is not assignable to type...
1127 просмотров
schedule
24.10.2022
Как сделать изменчивое состояние в истории реактивного маршрутизатора?
В настоящее время я работаю над отображением сообщения об успешном/неудачном выполнении на перенаправленной странице.
Рабочий процесс будет выглядеть так,
Пользователь набирает что-то на странице A и отправляет. затем сделайте history.push...
97 просмотров
schedule
28.03.2024
Как установить тип машинописного текста для возвращаемого значения matchPath
Я пытаюсь использовать matchPath для извлечения параметра маршрута из родительского контейнера, как описано в https://stackoverflow.com/a/45492498/3574819
const topicMatch = matchPath(history.location.pathname, { path: '/:topic' });
Когда...
1092 просмотров
schedule
15.06.2023
Как передать реквизиты магазина redux через рендеринг маршрута с помощью response-router?
Я новичок в сокращении и застрял в передаче реквизитов redux для маршрутизации проблемы рендеринга.
×
TypeError: Cannot read property 'quantity' of undefined
PageLayout._this.render
src/components/controls/PageLayoutRoute/PageLayoutRoute.js:135...
639 просмотров
schedule
07.04.2023
Маршрутизатор React всегда отображает путь '/'
Я пытаюсь использовать реагирующий маршрутизатор v4, но маршрутизатор всегда отображает начальный путь ('/'). я использую
react: ^16.2.0
react-dom: ^16.2.0
react-router-dom: ^4.2.2
Когда я пытаюсь отобразить /#/account, он...
3232 просмотров
schedule
02.12.2022
Как переписать защищенный / частный маршрут с помощью TypeScript и React-Router 4, 5 или 6?
Я пытался создать <PrivateRoute> , как описано в документах используя TypeScript. Может кто-нибудь мне помочь?
PrivateRoute в документе response-router:
const PrivateRoute = ({ component: Component, ...rest }) => (
<Route...
28611 просмотров
schedule
07.06.2022
Страница входа отделена от одностраничного приложения (SPA) в ReactJS
Я разрабатываю одностраничное приложение (SPA) в ReactJS и хотел бы знать, как разместить страницу входа на отдельной странице.
Я использую create-react-app в качестве основы для своего приложения, и в настоящее время я определяю шаблон для...
6548 просмотров
schedule
06.11.2022
React Router v4 - перенаправить на все URL-адреса в нижнем регистре?
Я пытаюсь выяснить, возможно ли обнаружить URL-адреса с заглавными буквами и перенаправить их на тот же URL-адрес со всеми строчными буквами.
Таким образом, что-то вроде «/products/Top/» будет перенаправлено на «/products/top/».
Возможно ли...
1885 просмотров
schedule
11.06.2022
Простая условная маршрутизация в Reactjs
Как сделать условную маршрутизацию, если и только если выполняются некоторые условия, тогда должна происходить только маршрутизация. например, если и только если пользователь вводит правильные учетные данные, вход в систему должен быть успешным, и...
91597 просмотров
schedule
30.04.2024
React Router работает только несколько раз
В настоящее время я экспериментирую с использованием React Router на создаваемом мной веб-сайте. Я столкнулся с использованием React Router для навигации по моему веб-сайту, а также для других вещей, таких как чтение значений параметров и т. Д....
228 просмотров
schedule
03.05.2022
React TypeError: местоположение не определено
В настоящее время я работаю над созданием стандартного приложения для реагирования. Я следил за этими руководствами, но не смог пройти мимо первый учебник.
Я создал свое приложение с помощью create-react-app
Когда я пытаюсь запустить...
5716 просмотров
schedule
13.09.2023
Совпадающий маршрут не меняется при изменении хэша маршрутизации
Я использую react-router-dom с react-router-redux и history для управления маршрутизацией для своего приложения. Я также использую историю хэшей для поддержки устаревших браузеров. Ниже приведены компоненты моего маршрута:
<Switch>...
816 просмотров
schedule
04.03.2023
Дом маршрутизатора ReactJS. Динамические маршруты с регулярным выражением
В настоящее время я немного играю с React Router Dom, и я задаюсь вопросом, возможно ли иметь некоторые динамические маршруты.
Я знаю, что у меня может быть динамическая маршрутизация со следующим:
<Route path="/component/:param"...
988 просмотров
schedule
23.12.2022
Вы не должны использовать Link вне маршрутизатора с помощью response-router-dom
Я пытаюсь выполнить маршрутизацию с помощью response-router-dom. Я получил ошибку, как будто вы не должны использовать за пределами этого. Ниже я прикрепляю свой код, пожалуйста, проверьте.
index.js
import React from 'react'
import { render...
4588 просмотров
schedule
21.06.2022
