使用Routes替代Switch后应用消失，删除路由属性才可渲染如何解决？

问题出在 react-router-dom v6 对 <Route> 组件的语法要求上——不能直接把组件作为子元素嵌套在 <Route> 里，必须通过 element 属性传入要渲染的JSX元素。

修改后的路由代码 #

<Router>
  <Navbar/>
  <Alert/>
  <Routes>
      <Route path="/about" element={<About />} />
      <Route path="/" element={<TextForm />} />
  </Routes>
</Router>

额外检查点 #

• 确认你的 react-router-dom 版本是v6：可以在终端执行 npm list react-router-dom 查看版本号，如果是v5及以下，要么升级到v6，要么换回 <Switch> 的写法。
• 确保所有 <Route> 都正确使用了 element 属性，没有遗漏或写错格式。

内容的提问来源于stack exchange，提问作者Pusparghya Mukherjee