@vowel.to/client / index / createReactRouterAdapter
Function: createReactRouterAdapter()
ts
function createReactRouterAdapter(
navigate,
location,
routes?): NavigationAdapter;Defined in: lib/vowel/adapters/navigation/react-router-navigation-adapter.ts:209
Create a React Router adapter using navigation hooks This is a convenience function for quick setup
Parameters
| Parameter | Type | Description |
|---|---|---|
navigate | ReactRouterNavigateFunction | navigate function from useNavigate() hook |
location | ReactRouterLocation | location object from useLocation() hook |
routes? | VowelRoute[] | Optional array of routes |
Returns
NavigationAdapter
Example
tsx
import { useNavigate, useLocation } from 'react-router-dom';
import { createReactRouterAdapter } from '@vowel.to/client/adapters/navigation';
function App() {
const navigate = useNavigate();
const location = useLocation();
const navigationAdapter = useMemo(
() => createReactRouterAdapter(navigate, location, [
{ path: '/', description: 'Home page' },
{ path: '/about', description: 'About page' },
{ path: '/products', description: 'Products listing' }
]),
[navigate, location]
);
return <Vowel navigationAdapter={navigationAdapter} />;
}