Как добавить пользовательское поведение в кнопку назад браузера?

Question

Я использую сервис визуализации внешних данных и связал его контент с маршрутами.Так, например, «/ Scorecard» будет отображать рапорт Scorecard, который содержится в объекте службы визуализации данных.

Я использую React с реакцией-router-dom.

Хитрость в том, что я делаюНе меняйте свой компонент React на основе этих маршрутов, так как я не хочу восстанавливать визуализацию данных каждый раз, когда пользователь меняет страницу.Итак, что изменилось, так это сам маршрут, и я вызываю API для изменения отчета (проверьте код ниже)

Я безуспешно пытался событие window.onbeforeunload, так как я не изменяю страницу.Я не хочу заменять ожидаемое поведение кнопки «Назад», но добавляю дополнительный вызов API для возврата к предыдущему отчету.

onButtonClick = (dashboardName) => {
    if (this.props.currentViz) { //check if external API object is instantiated
        this.props.history.push(dashboardName);     

        this.props.currentViz
            .getWorkbook()
            .activateSheetAsync(dashboardName);
    };
};

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

Есть идеи для решения этой проблемы?