Currently, I have implemented the Next.js Router to facilitate the display of different dashboards based on the URL slug. While this functionality works seamlessly when a button with the corresponding link is clicked (as the information is passed to the Next.js Router), it fails to perform as expected when a URL is directly inputted into the browser. In other words, dynamic routes do not work if the user refreshes the page or manually enters the URL with the specific slug.
I am able to utilize dynamic routes effectively when links are pressed, but I am seeking guidance on how to enable dynamic routes even when a link is not explicitly pressed. Your help in addressing this issue would be greatly appreciated.
const dashboard = () => {
const router = useRouter();
const {dashboardID} = router.query;
return (
<Dashboard dashboardID = {dashboardID}/>
);
}
export default dashboard