createRoutesFromElements

Framework
Data
Declarative

Summary

Create route objects from JSX elements instead of arrays of objects.

const routes = createRoutesFromElements(
  <>
    <Route index loader={step1Loader} Component={StepOne} />
    <Route path="step-2" loader={step2Loader} Component={StepTwo} />
    <Route path="step-3" loader={step3Loader} Component={StepThree} />
  </>
);

const router = createBrowserRouter(routes);

function App() {
  return <RouterProvider router={router} />;
}

Params

children

The React children to convert into a route config

parentPath

The path of the parent route, used to generate unique IDs. This is used for internal recursion and is not intended to be used by the application developer.

Returns

An array of RouteObjects that can be used with a DataRouter