minidocs

上一页与下一页

上一页和下一页按文档树的顺序决定,也就是侧边栏从上到下的顺序。分组和外部链接会被跳过。

---
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
本页目录
搜索范围
输入关键词开始搜索