react-router-dom，组件不渲染，但仅显示 <App>

【问题标题】：react-router-dom, component not rendering but only <App> shows insteadreact-router-dom，组件不渲染，但仅显示 <App>
【发布时间】：2022-01-10 03:46:58
【问题描述】：

App.js:-

function App() {
  return (
    <BrowserRouter>
 
 <h1>App screen</h1>

    <Routes>
    <Route path="/projectDashboard"  component={ProjectScreen} ></Route>
    <Route  path="/" component={HomeScreen} ></Route>
    </Routes>


  </BrowserRouter>
  );

我得到的输出：-

我只能看到 h1 标签。路线不起作用。每当我输入“localhost:3000/projectDashboard”时，它会自动更正并将我发送到“/”

我查看了其他答案并尝试设置确切的变量，但问题仍然存在。

【问题讨论】：

标签： reactjs react-router react-router-dom

【解决方案1】：

在 RRDv6 中，Route 组件在 element 属性上渲染它们的组件as JSX，component 和 render 属性不再存在。 p>

<Routes>
  <Route path="/projectDashboard" element={<ProjectScreen />} />
  <Route path="/" element={<HomeScreen />} />
</Routes>

供参考Routes & Route

interface RouteProps {
  caseSensitive?: boolean;
  children?: React.ReactNode;
  element?: React.ReactElement | null;
  index?: boolean;
  path?: string;
}

【讨论】：