Переходите на другой маршрут программно

Question

У меня есть сценарий использования, где у меня есть список элементов внутри некоторого компонента, похожего на vanilla html select. Я хочу, когда пользователь нажимает на любой элемент внутри списка, маршрут должен измениться. Могу ли я использовать некоторые регулярные выражения при определении маршрута и изменить маршрут с помощью какого-либо метода API из реагирующего маршрутизатора, событие onValueChange выбора?

Пример корневого маршрута: / Список данных: кошка, собака, слон

Когда кто-то нажимает на Cat, я хочу, чтобы он перешел к /Cat, аналогично /Dog, /Elephant.

Answer 1

Итак, поговорим об этом немного. понял, что ты хотел сделать.

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

<Route exact path="/:name" component={SomeComponent} /> 

в вашем компоненте у вас есть доступ к этому "имени" через this.props.params.name

Вы также можете вызвать действие для обновления магазина до обновления этого маршрута

---

Примечание: если вы остаетесь с v2... Вы должны заставить свои действия возвращать обещание, чтобы вы могли просто связать событие в своем компоненте. иначе:

onChange={this.handleChange}

handleChange = (value) => { // assuming you have the value here.. it may be e is the function param and you get the value as e.target.value
    this.props.saveSelectedAnimal(value).then( () => {
        this.props.history.push("/"); 
    })
}