Next.js获取路由参数及styled-jsx 的使用

2021-07-22

pages目录

在Next.js中路由的概念是pages下的文件目录即是路由层级，文件即是路由如下：
直接在根目录下的pages文件夹下，新建一个jsyang.js页面，启动后 访问路径为/jsyang

// pages                    ---路由文件
//   _app.js                ---启动文件，不走路由
//   _document.js           ---宿主文件，不走路由
//   a.js                   ---可通过http://localhost:3000/a 进行访问
//   b.js                   ---可通过http://localhost:3000/b 进行访问
//   test                   ---二级路由
//     aa.js                ---可通过http://localhost:3000/test/aa 进行访问

页面跳转

1.Link跳转

import Link from 'next/link'
<Link href="/a?id=1" as="/a/1">               
	<span>点击我跳转到a页面</span>           
</Link>

2.Router跳转

import Router from 'next/router'
<Button onClick={
   ()=>{
    
	Router.push(