Как использовать React-роутер для динамического URL

Question

Я создаю чрезвычайно гибкое приложение реакции и использую SSR для SEO.но я не знаю, как обращаться с URL

Как: пользователь может напрямую попасть на этот URL, domian.com / delhi / cardiologist

В бэкэнде яУ меня есть система идентификации компонентов для URL, которая в данном случае является "Специальным" компонентом в "Расположение: компонент

. Я не могу пойти так

<Rout path={"delhi"}>
    <Location/>
</Route>

причина для этогоЕсли это Дели, но для другого пользователя это будет другое название города, я хочу отразить другой город в URL, но отобразить тот же компонент из-за лучшего SEO. SEO - это сердце моего приложения.

Ябуквально новичок в такого рода вещах. пожалуйста, ведите меня.

Answer 1

Я бы рекомендовал добавить к пути некоторую структуру, которая облегчит вам поиск местоположения, например:

<Route path='/search/:city/:specialty' component={Specialty} />

Так что это будет соответствовать domian.com/search/delhi/cardiologist.Вы можете настроить его так, чтобы это имело смысл, это может быть даже короткое письмо, например /go/, если вас беспокоит длина URL из-за SEO.

Затем внутри компонента Specialty вы можете использовать match.params.city и match.params.specialty для получения параметров, которые вы ищете:

function Specialty({ match }) {
  const { city, specialty } = match.params;

  return (
    <p>Search for {specialty} in the city of {city}</p>
  );
}

Вы все еще можете реализовать маршрут catch-all , используя нужный путь:

<Route path='/:city/:specialty' component={Specialty} />

Однако для этого потребуется всегда устанавливать маршрут в конце, чтобы он попадал на ваш компонент <Specialty />, только если он не совпадает ни с каким другим вашим путем.