上一页与下一页
上一页和下一页按文档树的顺序决定,也就是侧边栏从上到下的顺序。分组和外部链接会被跳过。
---
import { Pager } from '@minidocs/astro/components';
import { navState, neighbors } from '@minidocs/astro/runtime';
const nav = navState(tree, id);
const { prev, next } = neighbors(tree, id);
---
<Pager.Root label="翻页">
{prev && (
<Pager.Link rel="prev" href={nav.of(prev).href}>
<Pager.Label>上一页</Pager.Label>
<Pager.Title>{prev.label}</Pager.Title>
</Pager.Link>
)}
{next && (
<Pager.Link rel="next" href={nav.of(next).href}>
<Pager.Label>下一页</Pager.Label>
<Pager.Title>{next.label}</Pager.Title>
</Pager.Link>
)}
</Pager.Root>
链接用 nav.of(node).href 取,和侧边栏用的是同一个 nav。多语言站点把 tree 换成 tree[locale]。
rel 是 prev 或 next,决定链接放在左边还是右边,只有下一页时它仍然靠右。「上一页」「下一页」这样的文字写在 Pager.Label 里,可以换成别的说法或翻译。每个组件的参数见组件与样式。
规则
- 同一个页面在树里出现多次时,按第一次出现的位置计算
- 第一页没有上一页,最后一页没有下一页,对应的
prev或next是undefined