1:创建项目

'use client'
import { useRouter } from 'next/navigation'

export default function Home() {

  const router = useRouter()

  const buttonClickLogin =() => {
    router.push('/login');
  }


  const buttonClickSignUp =() => {
    router.push('/signUp')
  }
  return (
    <>
      home
      <button onClick={buttonClickLogin}   >
        Go login
      </button><br/><br/>
      <button onClick={buttonClickSignUp}   >
        Go sign up
      </button>
    </>
  );
}

2:在每个文件夹中创建对应page页面，由于nextjs 路由默认按照文件夹page来访问

image.png

login页面访问路径 http://127.0.0.1:3000/login

sigin页面访问路径 http://127.0.0.1:3000/signUp

3:login页面

"use client";


export default function Login() {
  return (
    <>
      login
    </>
  );
}

4:signUp页面

"use client";
export default function SignUp() {
  return (
    <>
      SignUp
    </>
  );
}

访问home页面

image.png

image.png

image.png

github代码