Integrate React and Router v6
App.tsx:
const Page1 = lazy(() => pMinDelay(import('./views/Page1'), 500))
const Page2 = lazy(() => pMinDelay(import('./views/Page2'), 500))
return (
<Suspense fallback={<Loading/>}gt;
<Routes>
<Route path='/page1' element={<Page1/>}/>
<Route path='/page2' element={<Page2/>}/>
Navigation:
<Link to='/page1'>Go to Page 1</Link>
<Link to='/page2'>Go to Page 2</Link>
Upon initial visit to URL /page1, the loading with 0.5s delay functions correctly, but subsequent navigations do not trigger the loading and delay.
I am seeking a solution to consistently display a loading spinner with minimal delay when navigating using /page1 and /page2.
Using <Link reloadDocument ..> is not suitable for my application as it would result in a full app refresh.