现在 post 页面的地址有点难看,可以使用 next 提供的 Route Masking 重新设计一下这个地址 .. 打开 index 页面 .. 给这个 ListItem 组件里用的 Link 组件,添加一个 as 属性 .. 它的值就是链接的新地址 .. /p/ 后面加上 props 里的 id 属性的值 ..
使用 ListItem 组件的时候,给它提供一个 id 属性 .. 设置一下对应的值 .. hello-ninghao .. 同样下面这个 ListItem 也需要处理一下 .. learn-next ..
回到浏览器,再试一下 .. 点击一个列表项目 .. 注意现在打开的页面的地址,就是我们使用 Link 的 as 属性重新设计的 ..
按一下 返回 .. 可以返回到上一次打开的页面 ..
再打开一个链接项目 .. 然后可以刷新一下页面 .. 会提示 404 .. 因为当前访问的页面实际上是不存在的 .. 我们可以通过自定义服务端接口解决这个问题 ..