As per the code you shared, you are using basic and minimal features of the package(react-router-dom
)
You will be able to differentiate when you start using loader
, actions
and many other properties in your routing definition.
To make myself clear: Example (for understanding only)
{
path: ':eventId',
id: 'event-detail',
loader: eventDetail,
children: [
{
// path: '', // if I use empty path my action(deleteEvent) will not work
index: true, // I need to use this, then my action will work
element: <EventDetailPage />,
action: deleteEvent
},
{
path: ':edit',
element: <EditEventPage />,
}
]
For now, defining index or path is same for you based on your code, if that is what your doubt is.
Thanks