Route 不是组件。 Routes 的所有子组件必须是 Route 或 React.Fragment

问题描述 投票:0回答:0

这是我的 App.js 文件,我正在尝试创建一些路径,但即使在我的 IsUserRedirect 周围包装了一个 Route 元素后,我仍然收到错误消息。


import React, {Fragment} from 'react';
import * as ROUTES from './constants/routes';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import { Browse, Home, Signin, Signup } from './pages';
import {IsUserRedirect, ProtectedRoute} from './helpers/routes';
import { useAuthListener } from './hooks';

function App() {

  const { user } = useAuthListener();

  return (
    <>
    <Router>
      
       <Routes>

            <Route>
              <IsUserRedirect user={user} loggedInPath={ROUTES.BROWSE} path={ROUTES.SIGN_IN}>
                  <Signin />
              </IsUserRedirect>
            </Route>     

            <Route>
              <IsUserRedirect user={user} loggedInPath={ROUTES.BROWSE} path={ROUTES.SIGN_UP}>
                  <Signup />
              </IsUserRedirect>  
            </Route>

            <Route>
              <ProtectedRoute user={user} path={ROUTES.BROWSE}>
                  <Browse />
              </ProtectedRoute>              
            </Route>

            <Route>
              <IsUserRedirect user={user} loggedInPath={ROUTES.BROWSE} path={ROUTES.HOME}>
                  <Home />
              </IsUserRedirect>              
            </Route>          


        </Routes>      
      </Router>   
    </>
  );

}

export default App;

由于我的 react-dom 版本在 v6 以上,我尝试将我的包装到元素中。但是,我仍然收到此错误:

<Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>.
[IsUserRedirect] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>.
javascript reactjs react-dom
© www.soinside.com 2019 - 2024. All rights reserved.