reactjs - history change url does not load

Question

When you click on the button, the url changes but the redirect does not occur. If you reload manually, then it opens the desired page. Tell me how to fix this problem. I suspect the problem is with router and history communication.

ROUTE.JS

import React, {Component} from "react";
import Cookies from "universal-cookie";
import history from "../../history";

const {SubMenu} = Menu;

export default class Sider extends Component {

    outUser = () => {
        const cookies = new Cookies();
        cookies.remove("jwt", { path: '/' });
        history.push("/");
    }

    render() {
        return (
            <div>
           
                <Button onClick={this.outUser}>Выйти</Button>
            </div>
        );
    }
}

APP.JS

import React from "react";

import {
    BrowserRouter as Router,
    Switch,
    Route
} from "react-router-dom";
import history from "./history";

import Auth from "./pages/auth/component"

import HomePage from "./pages/home/component";

import Cookies from 'universal-cookie';


const cookies = new Cookies();

function App() {
    return (
        <Router history={history}>
            <Switch>
                <Route exact component={Auth} path="/" />
              
                    <div className="App">
                       
                        <div className="pages">
                            <Route component={HomePage} path="/home"/>
                
                        </div>
                    </div>
            </Switch>
        </Router>
    );
}

question from:https://stackoverflow.com/questions/65670839/history-change-url-does-not-load

Answer 1

Waitting for answers