Заменить только последнюю часть пути в URL

Я использую react-router-dom v4.3.1.

Например: у меня есть следующий URL-адрес http://localhost:3000/url1/url2/url3

Мне нужно заменить только последний маршрут в URL: /url3 → /mynewroute3

Как это сделать с историей?


reactjs url react-router browser-history
person D.Mark    schedule 12.11.2018    source источник
comment
Каким образом должно быть изменение? <Link>? программно?   -  person vsync    schedule 12.11.2018
comment
программно   -  person D.Mark    schedule 12.11.2018

Ответы (2)


arrow_upward
6
arrow_downward

Используйте историю.push

someMethod = () => {
  const { history } = this.props;
  history.push(`/url1/url2/url_new`);  // change url3 to "url_new"
}

В this.props должно быть history, если вы использовали withRouter в корневом компоненте.

При выполнении history.push(...) маршрутизатор принимает изменение и действует в соответствии с ним.

Измените только последнюю часть URL-адреса;

location.pathname.split('/').slice(0,-1).join('/') + '/newPath'

Регулярное выражение:

location.pathname.replace(/[^/]*$/, newPath)

Вышеприведенное берет текущий путь к окну, вырезает часть после последнего / (включая) и добавляет новую строку (новый путь)

person vsync    schedule 12.11.2018
comment
Идеальный! Благодарю вас! - person D.Mark; 12.11.2018

arrow_upward
2
arrow_downward

Я знаю, что этот вопрос задан для React Router v4, но я пытался выполнить то же самое с React v5 и найти этот ответ. Для справки в будущем, в React Router v5 я смог выполнить это, используя следующее:

history.push('./mynewroute3'); // Changes last part 

history.push ('./../mynewroute3'); // /url1/url2/url3 => /url1/mynewroute3
person OldWolfs    schedule 13.10.2020