相关疑难解决方法(0)

如何使用 React Router v6 和测试库测试路由逻辑?

我按照本教程从 React Router v5 迁移到 v6 。我想用react-testing-library来测试它,但是我的旧单元测试(使用本文档中的模式)停止工作。

我的 React Router v6 应用程序是这样的

const router = createBrowserRouter([
    {
        path: "/",
        element: (
            <>
                <SiteHeader />
                <Outlet />
            </>
        ),
        errorElement: <NotFound />,
        children: [
            { path: "/", element: <Home /> },
            { path: "/posts", element: <Posts /> },
            { path: "/post/:postId", element: <PostPage /> },
        ],
    },
]);

function App() {
    return (
        <div className="app">
            <RouterProvider router={router} />
        </div>
    );
}
Run Code Online (Sandbox Code Playgroud)

正如你所看到的,它使用RouterProvider而不是Switch/ Route …

reactjs react-router react-router-dom react-testing-library

9
推荐指数
1
解决办法
2万
查看次数