I'm trying to create two constants that contain the slug information from my dynamic page, but apparently useRouter from next/router has been thrown out of nextJS support. Would any of you know how to do this from here? I saw searchParams but that doesn't seem to work for my usecase. The link I would be checking is:
localhost:3000/breed/australian-shepherd
and the code is
"use client"; // This is a client component as otherwise useState wouldn't function
import React from 'react'
import { useRouter } from 'next/router';
import type { Metadata } from 'next'
export default function Breedpage() {
const router = useRouter();
const slug = router.query.slug; // Access the slug from the router's query object
// Separate the first and second word using split()
const [firstWord, secondWord] = typeof slug === 'string' ? slug.split('-') : ['', ''];
return (
<div>
<h1>First Word: {firstWord}</h1>
<h1>Second Word: {secondWord}</h1>
</div>
)
}
Again, I apparently need an alternative to useRouter... Thanks for any help you can give, I'm somewhat clueless..