Я использую один и тот же компонент для трех разных маршрутов:


    
    
    

А можно как то скомбинировать, чтобы было вроде:


    

Ответы (6)

Другой вариант: использовать префикс маршрута./ страниц например. Вы получите

  • / стр. / Главная
  • / страниц / пользователей
  • / страницы / виджеты

А затем детально разрешите его внутри компонента Home.


  

Начиная с response-router v4.4.0-beta.4и официально в v5.0.0, теперь вы можете указать массив путей, которые разрешаются в компонент, например,


    

Каждый путь в массиве представляет собой строку регулярного выражения.

Документацию по этому подходу можно найти здесь.

Согласно документации React Router, proptype 'path' имеет тип string. Таким образом, вы не можете передать массив в качестве props в компонент Route.

Если вы намереваетесь изменить только маршрут, вы можете использовать один и тот же компонент для другого маршрута, никаких проблем с этим

Начиная с response-route-dom v5.1.2, вы можете передавать несколько путей, как показано ниже

 

И очевидно, что вам нужно импортировать Home jsx файл поверх.

По крайней мере, с реактивным маршрутизатором v4 путь может быть строкой регулярного выражения, поэтому вы можете сделать что-то вроде этого:


    

Как видите, это немного многословно, поэтому, если ваш компонент/route такой простой, это, вероятно, того не стоит.

И, конечно, если это действительно часто возникает, вы всегда можете создать компонент-оболочку, который принимает параметр массива paths, который повторно использует логику регулярного выражения или .map.

Не думаю, что если вы используете версию React Router ниже v4.

Вы можете использовать карту, как и любой другой компонент JSX:


    {["/home", "/users", "/widgets"].map((path, index) => 
        
    )}

РЕДАКТИРОВАТЬ

Вы также можете использовать регулярное выражение для пути в response-router v4, если оно поддерживается path-to-regexp. См. Ответ @ Cameron для получения дополнительной информации.

2022 WebDevInsider