Browserrouter redirect

I’m new to react.js. This is my question. This line browserHistory.push(“/Main”)
does not redirect to the main page after the successful login. Not sure the reason. Please help. I have already searched on the internet but couldn’t find one to solve my problem. The URL address bar shows http://localhost:3000/Main but it does not redirect to the main page.

App.js

import React from "react"
import Login from "./Login"
import Main from "./Main"
import  {BrowserRouter as Router,Route,Switch}  from "react-router-dom"

function App() {
  
  return (
    <Router>
      <div className="App">

        <Switch>
          <Route exact path="/" component={Login}></Route>
          <Route path="/main" component={Main}></Route>
        </Switch>
          
      </div>
    </Router>
  )
  
}
export default App

APIService.js

import React, { Component } from 'react';
import { browserHistory } from 'react-router';

export default class APIService extends Component{
    

    static InsertData(body){
        return fetch("/login",{
            'method':'POST',
              cache: "no-cache",
              headers : { 
                'Content-Type': 'application/json'
                
               
      },
      body:JSON.stringify(body)
    })
    .then(response=>{
        if(response.ok){
            return response.json()
            }
        }
        
    ).then(
        data=>{
            if(data["isLogin"]===1){
              console.log(data)
              browserHistory.push("/Main") // this line
            }
            
        }
    )
    .catch(error => console.log(error))
    }
}