Hi This is Tanbhir Hossain, I am trying to Convert HTML Templates to react js. The problem is in React Router.

When i Click any the Page only show the Preloading Until manually Refresh the page. When Refresh the page it's show finely . Now I want to get rid of this problem

here is my RouterPage.js

import React, { Component } from 'react';
import {BrowserRouter  as Router, Routes, Route} from 'react-router-dom'
import Home from './Home';
import About from './About';
import Contact from './Contact';

class RouterPage extends Component {
    render() {
        return (
            <div>
                <Router>
                    <Routes>
                        <Route  path='/' element={< Home />} />
                        <Route  path='/about' element={< About />}/>
                        <Route  path='/contact' element={< Contact />}/>
                    </Routes>
                </Router>
            </div>
        );
    }
}

export default RouterPage;

Here is my Link

 <Link  to={'/about' } data-toggle="dropdown" className="dropdown-toggle nav__item-link">About Us</Link>

When I click This Link Preloading is Loading unlimited time

When i manually refresh the page it's working finely