使用 React Router v6 渲染 React 組件變量

Question

我正在使用 react router v6，我想渲染存儲在變量中的組件。 在早期版本的 React Router 中，它們具有組件屬性，允許您使用不使用 JSX 語法的變量來渲染組件，但是 V6 不允許這樣做。

import ComponentName from "components/ComponentName"
...
const component = ComponentName;
...
<Router path="..." element={component } />

Answer 1

您可以將變量稱為 function

import ComponentName from "components/ComponentName"
...
const component = ComponentName;
...
<Router path="..." element={component()} />