Как переопределить кнопку «Назад», когда ящик отображается в React 16 / Router V4 - PullRequest
Новая
       11

Как переопределить кнопку «Назад», когда ящик отображается в React 16 / Router V4

0 голосов
/ 02 апреля 2019

У меня есть такая структура, есть маршрут вроде: 

<Route path="/sample-route" component={ComponentA}/>

Тогда ComponentA имеет: 

<ComponentA>
  <ComponentB/>
  <ComponentC>
    <MaterialUIDrawer/>
  </ComponentC>
</ComponentA>

ComponentC используется в 5 различных маршрутах какребенок.MaterialUIDrawer отображается на основе флага в редукторном редукторе.Проблема, которую я пытаюсь решить, - когда ящик открыт, щелчок назад скрывает его, но также перемещается назад.Я попытался решить это следующим образом: 

window.onpopstate = (e) => {
   if (this.props.isOpen) {
     this.props.toggleDrawer(false);
     this.props.history.replace(this.props.match.url);
   }
 };

У этого есть 2 проблемы:

  • Если это первая страница, на которой вы попадаете, она на самом деле ничего не делаетфункция не срабатывает

  • Если вы находитесь на другом сайте и переходите по URL-адресу, содержащему ящик, нажатие кнопки «Назад» перемещает вас на другой URL (другой домен)

Я также попытался установить <Route/> в ComponentC, и тогда ящик живет там, но мне не удалось заставить его работать, возможно, путь неправильный.Казалось, что это может быть правильный путь, хотя, если путь /path1, тогда ящик живет в /path1/drawer, или /path2/drawer, и т. Д.

Я пытаюсь найти путь для спиныкнопка в браузере, чтобы закрыть ящик (чтобы выполнить определенную мной функцию) и переопределить функциональность по умолчанию.

1 Ответ

1 голос
/ 02 апреля 2019

Я думаю, что вы должны использовать здесь реквизиты вместо путей, что-то вроде /path1?drawer=1, но вам определенно нужно будет использовать историю / местоположение, чтобы кнопка возврата могла на самом деле вернуться назад, чтобы вы были на правильном пути.

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

...