Блог

Главная - Вопросы по программированию - Реагируйте на навигационную ссылку: Захват динамических маршрутов, но перенаправление onClick на определенный маршрут

Реагируйте на навигационную ссылку: Захват динамических маршрутов, но перенаправление onClick на определенный маршрут

#react-router #react-router-dom #react-router-v4

Вопрос:

Мой маршрут навлинка выглядит следующим образом:

 <NavLink
            key={element.id}
            to={element.uri || '/'}
            className={classes.NavBarElements}
            activeStyle={element.activeStyle || preDefinedActiveStyle}>
            {icon} <p className={classes.TagElement}>{element.label}</p>
          </NavLink>

Теперь объект элемента выглядит следующим образом:

  config: {
    id: nanoid(),
    label: 'Connect amp; Mix',
    uri: '/config/metadata',
    action_id: 'level0__config',
    action_state: {},
  }

Теперь я хочу, чтобы у этого element.uri был такой маршрут: /config/:configType где :configType может быть что угодно из массива строк ( configTypesArray ), но при нажатии на эту вкладку он должен перейти к конкретному :configType , который является первым элементом configTypesArray . Я не уверен в том, как добиться того же самого.

массив маршрутизации выглядит следующим образом:

configTypesArray = ['metadata','datastream','nodatastream']

если пользователь переходит на любой другой маршрут, помимо указанного, мне интересно показать простую страницу <div>Page Not Found</div> .

Версия маршрутизатора React: "react-router-dom": "^5.2.0"

Метки: ,