Routing
Page and URL routing
DashboardKit routing system is based on react-router and its package react-router-dom, it's also using code splitting for better performance.
How can I add a new page with a menu item?
You can use the below explanation to add/remove menu routes and their menu items.
Open
...\src\routes\route.tsxYou will find the below example code. In the below code we have shown four different routes.typescript
src\routes\routes.tsx
import { lazy } from 'react';
// third party
import { Redirect } from 'react-router-dom';
// project imports
import AdminLayout from 'layouts/AdminLayout';
import { BASE_URL } from 'config/constant';
// -----------------------|| Routes ||-----------------------//
const routes = [
{
exact: true,
path: '/404',
component: lazy(() => import('../views/errors/NotFound404'))
},
...
...
{
path: '*',
layout: AdminLayout,
routes: [
{
exact: true,
path: '/dashboard/sales',
component: lazy(() => import('../views/dashboard/DashSales'))
},
{
exact: true,
path: '/dashboard/analytics',
component: lazy(() => import('../views/dashboard/DashAnalytics'))
},
...
...
{
path: '*',
exact: true,
component: () => <Redirect to={BASE_URL} />
}
]
}
];
export default routes;
Last modified 1yr ago