javascript - React Router 与特定的 React 组件不兼容

Question

我目前正在开发一个网站，一切都很好，直到我开始为桌面 pnes 开发单独的 mob vers，一段时间后，我注意到大多数 url 都没有呈现！我尝试删除所有嵌套路由，将它们全部移动到交换机和浏览器路由器所在的 App.js 中，但仍然只能访问几个页面！甚至大多数桌面组件都没有渲染，用替换<Route path="/pathname"><Components/></Route>语法<Route path='/pathname" component={<>Component</>}/>也没有帮助。

我附上了一块未渲染的组件。还有我的 App.js。在那之前，即使第一个暴徒组件被注入，一切都运行良好！我想知道是否有人有类似的问题......

<Route path="/signup"><><Global>
          { device === "mobile" ? <SignUpMob/> : <SignUp/> }
          </Global></></Route>
          <Route path="/loggedin"><><Global>
          { device === "mobile" ? <AfterSignInMob/> : <AfterSignIn/> }</Global></></Route>
           <Route path="/signedup"><><Global>
           { device === "mobile" ? <AfterSignUpMob/> : <AfterSignUp/> }</Global></></Route>
           <Route path="/admin"><><Global>
             { device === "mobile" ? "Mobile version - not developed yet!" : <Admin/> }
             </Global></></Route>
          <Route path="/meme"><><Global>
             { device === "mobile" ? <MemeMob/> : <Meme/> }
             </Global></></Route>
           <Route path="/factsnstats-media"><><Global>
            { device === "mobile" ? <MediaMob/> : <Media/> }
            </Global></></Route>
          <Route path="/factsnstats-election"><><Global>
            { device === "mobile" ? <ElectionMob/> : <Election/> }
            </Global></></Route>
          <Route path="/factsnstats-sharefacts"><><Global>
            { device === "mobile" ? <ShareYourFactsMob/> : <ShareFacts/> }
            </Global></></Route>
          <Route path="/factsnstats-datanstats">
          <> <Global>
            { device === "mobile" ? <DatanStatsMob/> : <DatanStats/> }
            </Global></>
            </Route>
          <Route path="/specificpost"><><Global>
            { device === "mobile" ? <SpecificPostMob/> : <SpecificPost/> }
            </Global></></Route>
          <Route path="/signin"><><Global>
            { device === "mobile" ? <SignInMob/> : <SignIn/> }
            </Global></></Route>
           <Route path="/politics-our" ><><Global>
            { device === "mobile" ? "Mobile version - not developed yet!" : <Our/> }
            </Global></></Route>
          <Route path="/politics-we"><><Global>
            { device === "mobile" ? "Mobile version - not developed yet!" : <We/> }
            </Global></></Route>
          <Route path="/comments"><><Global>
            { device === "mobile" ? <SpecificPostExtendedMob/>: <SpecificPostExtended/> }
            </Global></></Route>
          <Route path="/mzs-popular"><> <Global>
            { device === "mobile" ? "Mobile version - not developed yet!" : <MZsPopular/> }
            </Global></></Route>
           <Route path="/mzs-general"><><Global>
            { device === "mobile" ? "Mobile version - not developed yet!" : <MZsGeneral/> }
            </Global></></Route>
          <Route path="/writepost"><><Global>
            { device === "mobile" ? "Mobile version - not developed yet!" : <WritePost/> }
            </Global></></Route>
          <Route path="/" exact><> <Global>
            { device === "mobile" ? <BeforeSignInMob/> : <SignIn/> }
            </Global></></Route>

export default function PoliticsWe() {
  return (
    <>
     <Header><HeaderImg src="../../assets/headerpic.png"/><Navbar><span>mypage</span>| <span>log out</span></Navbar></Header>
      <Content><SideBar/><RightFrame><Title>Politics<Subtitle>We Forum</Subtitle></Title>
      <Tables>
        <Table>
        <thead>
        <tr>
        <th>Group</th>
        <th>Title</th>
        </tr>
        </thead>
        <tbody>
        <tr><td><div></div></td><td>Politics Our Forum 1 All time likes post. Politics Our Forum 1 All time likes post. Politics Our Forum 1 All time likes post. Politics Our Forum 1 All time likes post. Politics Our Forum 1 All time likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
        <tr><td><div></div></td><td>Politics Our Forum 2 All time likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
        <tr><td><div></div></td><td>Politics Our Forum 3 All time likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
        <tr><td><div></div></td><td>Politics Our Forum 4 All time likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
        <tr><td><div></div></td><td>Politics Our Forum 5 All time likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
        </tbody>
        </Table>
        <RightTable>
<thead><tr><th>Title</th></tr></thead>
  <tbody><tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
    <tr><td>ID</td><td>MZs Recent 3 days likes post</td><td><div><span><img src="../../assets/likes.png" alt=""/>3526</span><span><img src="../../assets/comments.png" alt=""/>3526</span></div></td></tr>
  </tbody></RightTable>
        </Tables>
      </RightFrame></Content>
    </>
  )
}

标签： javascriptreact-router