Как открыть мод семантической-UI-реакции по другому маршруту?

Question

Я использую Semantic UI React и React Router.Чего я хочу добиться, так это того, чтобы при открытии пользователем модального режима в адресе указывался маршрут, соответствующий модальному режиму, например, когда пользователь открывает модальный элемент, маршрут должен быть www.example.com/article.

Как мне этого добиться?

Answer 1

Модал внутри semantic-ui-реакции имеет логическое значение open.После того, как вы определили эту опору, вы переопределяете внутреннее состояние, которое контролируется на компоненте Modal из коробки.

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

Вам также потребуется обработать закрытие модального режима, поскольку он больше не является внутренним компонентом модального режима.Вероятно, самым простым способом было бы установить событие onClick на кнопку закрытия, которая подтолкнет историю маршрутизатора к предыдущему шагу.Или вы можете нажать в другое место, если вы предпочитаете идти в другое место.

Вы можете передать узел (не просто строку) в подпорку closeIcon, где вы могли бы фактически определить свою собственную кнопку и событие нажатиячто толкает роутер.