在内存路由器中封装组件时发生React测试错误

Question

我正在React上测试，我想查看页面的详细信息，我需要在路径中传递一个参数，所以我一直在搜索，我需要将我的组件封装在MemoryRouter和Route中，但我仍然得到一个错误：

内存路由器：

component = render(
<Provider store={store}>
<MemoryRouter initialEntries={['/characters/1009368']}>
<Route path="characters/:id">
<CharacterDetail />
</Route>
</MemoryRouter>
</Provider>,
);

这就是我得到的错误：

console.error
Error: Uncaught [Error: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>.]

我能做什么？

Answer 1

错误消息非常简单，将Route组件封装在Routes组件中。

例如：

<Routes>
<Route path="/welcome" element={<Welcome />} />
<Route path="/game" element={<Game />} />
<Route path="/leaderboard" element={<Leaderboard />} />
</Routes>

有关更多详细信息，请访问此处