在React Router中使用多个标头

Question

class App extends Component {
  render() { 
    let pathName=window.location.pathname;
    console.log('pathName==>',pathName);
    let loginhideheaderpath = pathName==="/" || pathName==="/login";
    let securnetheaderpath = pathName==='/Contentlanding/Reports';
    let gallerypath = pathName==='/Contentlanding/Gallerylanding'

    return (  
      <>   
      { securnetheaderpath ? <Securnetheader  /> : ( loginhideheaderpath) ? null :(gallerypath) ? <Galleryheading /> : <Header />   }
       <Router history={history}>
         <Switch>
           <Route exact path="/" component={Login} />
           <Route exact path="/login" component={Login} />
           <Route exact path="/Contentlanding" component={Contentlanding} />            
           <Route exact path="/Contentlanding/Birthdaylist" component={Birthdaylist} />
           <Route exact path="/Contentlanding/Reports" component={Reports} />
           <Route exact path="/Contentlanding/Gallerylanding" component={Gallerylanding} />
           <Route component={Nodocumentfound} />
         </Switch>
       </Router>
      </>
    );
  }
}

在我的项目中，我使用了多个标题，我根据URL渲染了组件的标题。我的状况很好。问题是当我使用浏览器的后退按钮时，标题未更改。任何解决此问题的解决方案，谢谢。

Answer 1

尝试使用window.location.href.split('#')[1]代替window.location.pathname