react-router Navigate component in Nextjs-CodePudding

How can i achieve a similar result just like Navigate component of react-router has, in Nextjs? There is a next/Router option but i want to return something to navigate.

i want to redirect the page, but not with router.push because i have to use a useEffect but i only want to know if there is a way to do the exact same thing using returning a component

Basically what is the equivalent of this in Nextjs without react-router

import { Navigate } from "react-router";

const Page = () => {
  const { user } = useAuth();

  if (user?.role.name === "user") {
    return <Navigate to={"/app"} />;
  } else {
    return <Navigate to={"/app/workspaces"} />;
  }
}

export default Page

CodePudding user response：

you can use router.replace if u dont wwant to push but it will have a flaw that it will overwrite the current route

router.replace(url, as, options)

CodePudding user response：

https://nextjs.org/docs/api-reference/next/router

router.push(url, as, options)

Is that what you mean?