Как установить параметры динамического URL в переменное значение с помощью react-router-dom

Я довольно много искал в Интернете для этого, но, похоже, не нашел правильного ответа на свой вопрос. Как изменить часть моего URL-адреса на значение, например, из UserInput.

Я использую react-router-dom v6 и реагирую 18.2.

Я пытался использовать UseParams, но это не сработало. Также я попробовал перенаправить и использовать историю, но это не привело к желаемому результату, возможно, я использовал их неправильно в своем сценарии.

Это то, что у меня есть до сих пор:

App.js


let persID = useContext(NumContext); // i use this since the Original value lays in another Script

return (


<Link to = "/schedule/mySchedule/:persID" ><p className = "NavText">My Timetable</p></Link> {/* persID is the dynamic URL part that should be replaced with a value out of varaible */}


<Route path = "/schedule/mySchedule/:persID" element = {<MySchedule />} />


)

Что я хочу, так это то, что если значение переменной равно 2, оно ведет к URL-адресу /schedule/mySchedule/2.

Я видел, как люди делали это, но им приходилось вручную заменять часть динамического маршрута.

Я благодарен за любые советы или рекомендации

Хук useOnClickOutside в ReactJS
Хук useOnClickOutside в ReactJS
Как разработчик ReactJS, вы, возможно, сталкивались с ситуацией, когда вам нужно закрыть модальное или выпадающее меню, когда кто-то щелкает за его...
Хуки (часть-2) - useEffect
Хуки (часть-2) - useEffect
Хук useEffect - один из самых мощных и универсальных инструментов в арсенале разработчика React. Он позволяет вам управлять побочными эффектами в...
[LXI-SpartaCodingClub Full-Stack Bootcamp in Indonesia] 2023/1/21 TIL/Week 15]
[LXI-SpartaCodingClub Full-Stack Bootcamp in Indonesia] 2023/1/21 TIL/Week 15]
Я научился создавать карусель в ReactJS с помощью библиотеки Splide.
Краткое введение в Styled-компоненты
Краткое введение в Styled-компоненты
В настоящее время популярность Styled-компонентов становится все больше и больше. Большинство проектов, построенных на React.js, используют эту...
ДЕНЬ 8 | Страница обзора в React
ДЕНЬ 8 | Страница обзора в React
На этом сегодня все, завтра снова увидимся с новым проектом!
Как настроить среду разработки React.
Как настроить среду разработки React.
Весь процесс настройки среды разработки react.
1
0
176
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий
Что я хочу, так это то, что если значение переменной равно 2, оно ведет к URL-адресу /schedule/mySchedule/2.

Вы можете использовать литерал шаблона, чтобы включить параметр persID в ссылку.

<Link to = {`/schedule/mySchedule/${persID}`} />

Дополнительная информация: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

Спасибо, я думаю, это было так просто

Gollasso 19.11.2022 20:39

Я обязательно буду :DO спасибо

Gollasso 19.11.2022 20:45

Другие вопросы по теме