refresh is not working for submenu path in react js

Viewed 162
  • Hello everyone, I am using react router "react-router-dom" with <Switch> and <Route>

. - In my website I have menus and submenus. - ex :: menus (with path in bracket)

  1) Home ('/home') , 2) Profile ('/profile') , 3) Admin ('/admin')
  • ex :: submenu :: only Admin tab has submenu
    a) setting ('/admin/setting') and b) History ('/admin/history')

  • App.js

     constructor(props) {
       history = createBrowserHistory();
    
       if (window.performance) {
         localStorage.setItem("currentpath",window.location.pathname);
         this.login();
        }
      }
    
      login = () =>{
         //ajax call
         //after ajax response 
    
            let  currentpath =  localStorage.getItem("currentpath");
            if(currentpath)
                this.history.push(currentpath );
            else
               this.history.push('/home');
      }
    
    
    
    
     render() {
       return (
          <React.Fragment>
             <Router history={this.history}>
              <div>
                <Switch>
                   <Route exact path="/" render={() => <Login/>} /> 
                  <Route exact path="/home" render={() =><HomepageLayout/>} />
                  <Route path="/admin" render={() => <AdminPageLayout/>} />
                  <Route path="/profile" render={() => <ProfilePageLayout />} />
                </Switch>
              </div>
        </Router>
      </React.Fragment>
    )
    }
    

  • Now the problem is, In local server refresh is working fine for all path. But in live server refresh is working when current page is Home and Profile. But for Admin->setting or Admin->history submenu tab refresh is not working.

  • These errors i am getting in console

     GEThttp://www.websoft.com/admin/setting                   [HTTP/1.1 304 Not Modified 322ms]
    
     GEThttp://www.websoft.com/admin/static/css/1.3ac8ff05.chunk.css   [HTTP/1.1 200 OK 341ms]
    
     GEThttp://www.websoft.com/admin/static/js/1.ef821ff9.chunk.js     [HTTP/1.1 304 Not Modified 324ms]
    
     GEThttp://www.websoft.com/admin/static/js/main.f0eaa457.chunk.js  [HTTP/1.1 304 Not Modified 329ms]
    
     GEThttp://www.websoft.com/admin/static/css/main.83e337cf.chunk.css
    
     The stylesheet http://www.websoft.com/admin/static/css/1.3ac8ff05.chunk.css was not loaded because its MIME type, “text/html”, is not “text/css”.
    
     The script from “http://www.websoft.com/admin/static/js/1.ef821ff9.chunk.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type
    
  • Its adding admin in path of chunk file when I refresh submenu.

1 Answers
  • You haven't shared your package.json but parameter "homepage" in package.json is very useful for making buildings.
  • I had same problem, I changed "homepage": "." in my package.josn to "homepage": "/".
  • If it doesn't work shared your current package.json for solving issue.
Related