react-router setRouteLeaveHook все еще обновляет URL

Я использую реакцию 15.3.1 с реактивным маршрутизатором 2.4.1 и реактивным маршрутизатором-редуксом 4.0.5:

Когда я перехватываю изменение маршрута с помощью:

this.props.router.setRouteLeaveHook(
    this.props.route,
    this.routerWillLeave
);

private routerWillLeave = () => {
    if (this.state.editing)
        return 'You may have unsaved changes. Are you sure you want to leave?'
};

... Я вызываю свой метод this.routerWillLeave, но URL-адрес в браузере все еще меняется, поэтому, даже если пользователь остается на странице, решив не покидать страницу, URL-адрес теперь неверен. Идеи?


reactjs javascript react-router react-router-redux
person Digant C Kasundra    schedule 06.10.2016    source источник
comment
Та же проблема, вы нашли способ избежать изменения этого URL-адреса?   -  person Donovan Charpin    schedule 24.02.2017

Ответы (1)


arrow_upward
1
arrow_downward

И если ваш react-route> 2.4, вы также можете использовать withRouter для обертывания вашего компонента, это может быть лучше!

import React, {Component} from 'react';
import {render} from 'react-dom';
import {withRouter} from 'react-router';

export default withRouter(class extends Component {
  state = {
    unsaved: true
  }
  componentDidMount() {
    this.props.router.setRouteLeaveHook(this.props.route, () => {
      if (this.state.unsaved) {
        return false;
          // At here you can give a confirm dialog, return true when confirm true
       }else {
          return true;
       }
    })
  }
  render() {
    return (
      <div>
        <h2>About</h2>
        {this.props.children || "This is outbox default!"}
      </div>
    )
  }
})
person shijie lu    schedule 15.11.2016