The error message 'export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' (possible exports: AbortedDeferredError, Await, BrowserRouter, Form, HashRouter, Link, MemoryRouter, NavLink, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, ScrollRestoration, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useScrollRestoration, createBrowserRouter, createHashRouter, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, createSearchParams, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, renderMatches, resolvePath, unstable_HistoryRouter, unstable_useBlocker, unstable_usePrompt, useActionData, useAsyncError, useAsyncValue, useBeforeUnload, useFetcher, useFetchers, useFormAction, useHref, useInRouterContext, useLinkClickHandler, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, useSearchParams, useSubmit)' indicates that the 'Switch' component is not available in the 'react-router-dom' library you're using. While the error message lists other possible exports, 'Switch' is missing. This usually stems from one of these reasons:

  • Version Mismatch: 'Switch' was deprecated in React Router v6 and replaced with the <Routes> component. If you're using an older version of React Router Dom, you might need to update it.
  • Incorrect Import: Ensure you're importing 'Switch' from the correct location. Double-check your import statement.

To fix this, take the following steps:

  1. Update React Router Dom: Upgrade to the latest version of 'react-router-dom'.
  2. Replace 'Switch' with <Routes>: If you're using React Router v6 or higher, replace the 'Switch' component with <Routes> for proper route handling.
  3. Verify Import: Make sure you're importing 'Switch' correctly from 'react-router-dom'.

Example (React Router v6):

import { Routes, Route, Link } from 'react-router-dom';

function App() {
  return (
    <Routes>
      <Route path='/' element={<Home />} />
      <Route path='/about' element={<About />} />
    </Routes>
  );
}

By addressing these potential causes, you should resolve the 'Switch' not found error and get your React Router Dom routing working correctly.

React Router Dom: 'Switch' Component Not Found - Troubleshooting Guide

原文地址: https://www.cveoy.top/t/topic/mkWF 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录