// Link
import Link from 'next/link';
<Link href={{ pathname: '/b', query: { name: '张三', age: '18', work: '前端开发' } }}><a>跳转</a></Link>
// router
import { useRouter } from 'next/router';
const router = useRouter();
router.push('/first?name=张思学&age=18&work=前端开发');
// 页面接收参数
import { useRouter } from 'next/router';
const router = useRouter();
const { name, age, work }: any = router.query;
console.log(name, age, work);
动态路由传参 + 跳转页面接收参数

创建动态路由在pages文件夹下创建details文件夹里面创建动态接收参数页面[id].tsx
// Link as内是参数
import Link from 'next/link';
<Link href='/details/[id]' as={`/details/1`}><a>跳转</a></Link>
// router
import { useRouter } from 'next/router';
const router = useRouter();
router.push('/details/[id]', '/details/1');
// details接收参数ID
import { useRouter } from 'next/router';
export default function details() {
  const router = useRouter();
  const { id }: any = router.query;
  console.log(id);
动态路由多参数传递 + 接收参数

创建动态路由在pages文件夹内创建post文件夹里面创建动态接收参数页面[...slug].tsx
//  Link  as内是参数 Link 
<Link href='/post/[...slug] as='/post/SX/18/IT'>
  <a className={style.button}>动态传参多参数</a>
</Link>
// router
import { useRouter } from 'next/router';
const router = useRouter();
router.push('/post/[...slug]', '/post/SX/18/IT');
// post 接收参数ID