React 功能组件不渲染但用于

Question

My functional component doesn't get rendered, first I was trying to access it with react-router, but currently I'm passing it right instead of App component to index.js render function. Other components get rendered. It'll be amazing if you could at least share your experience with, what might be a reason?

This component is where the problem is, it doesn't get rendered:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> export default function MZsPopular() { return ( <> <Header><HeaderImg src="../../assets/headerpic.png"/><Navbar><span>mypage</span>| <span>log out</span></Navbar></Header> <Content><SideBar/><RightFrame><Title>The story of Generation MZ<Subtitle>Popular</Subtitle></Title> <Tables> <Table> <thead> <tr> <th>Group</th> <th>Title</th> </tr> </thead> <tbody> <tr><td><div></div></td><td>MZs general forum All time likes post 1</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>MZs general forum All time likes post 2</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>MZs general forum All time likes post 3</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>MZs general forum All time likes post 4</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>MZs general forum All time likes post 5</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. MZs Recent 3 days likes post. MZs Recent 3 days likes post. MZs Recent 3 days likes post. MZs Recent 3 days likes post. 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> </> ) }

This components gets rendered:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> 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> </> ) }

Answer 1

I've found out that I just commented the part of component by coincidence and that's why it wasn't rendering