Getting the current url on the client side in next.js
You can wrap your component with withRouter
HOC, that will inject the router
object, that has current pathname
.
import { withRouter } from 'next/router';const Admin = ({ router }) => ( <AdminLayout> <style global jsx> {` body { background: #eff0f3; } `} </style> <div className="jumbotron" style={jumbotron}> {router.pathname == 'passform' ? <Passform /> : <h3>Something is wrong :/ . {page}</h3>} </div> </AdminLayout>);export default withRouter(Admin);
Edit
If you prefer hooks you can use useRouter
hook.
import { useRouter } from 'next/router';const Admin = () => {const router = useRouter();return ( <AdminLayout> <style global jsx> {` body { background: #eff0f3; } `} </style> <div className="jumbotron" style={jumbotron}> {router.pathname == 'passform' ? <Passform /> : <h3>Something is wrong :/ . {page}</h3>} </div> </AdminLayout>);};export default Admin;