Реакт не может отменить изменение истории - PullRequest
0 голосов
/ 25 октября 2018

У меня есть приложение реагирования, и я использую пакет history для обработки истории браузера, такой как отправка нового URL / состояния в историю или прослушивание события изменения истории.У меня проблема в том, что я не слушаю событие изменения истории в componentWillUnmount, так что когда компонент исчезнет, ​​событие изменения истории также будет удалено.Тем не менее, изменение истории всегда происходит до того, как происходит componentWillUnmout, поэтому я всегда получаю сообщение об ошибке «cant setState для несмонтированного компонента ...».У кого-нибудь есть решение здесь?

// browser_history.js
import History from 'history/createBrowserHistory';

const history = History();
export default history;

// index.js
import { Router } from 'react-router-dom';
import history from 'browser_history'; 
import App from 'app';

ReactDOM.render(
    <Router history={history}>
        <App />
    </Router>,
    document.getElementById('root')
);

// app.js
class App extends React.Component{
    constructor(props) {
        super(props);
    }

    render() {
        return(<Switch>
                   <Route path='/dashboard/' component={dashboard}
                   ...
                   ...
               </Switch>);
    }
}

// dashboard.js
import history from 'browser_history'; 

class Table extends React.Component{
    constructor(props) {
        super(props);
        this.unlisten_history = history .listen(this.onHistoryChange);
    }

    componentDidMount() {
        this.unlisten_history = history .listen(this.onHistoryChange);
    }

    onHistoryChange() {
        this.setState({...})
    }
}

1 Ответ

0 голосов
/ 25 октября 2018

Решение найдено.

Вместо использования <Route history={history}> с пользовательским объектом истории, используйте <BrowserRouter> и оберните компоненты с export default withRouter(xxx), чтобы у обернутого компонента было this.props.history, и я могу использовать его для добавления новогосостояние истории браузера, и этот объект истории всегда синхронизируется с любыми действиями реагирующей маршрутизации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...