@embedpdf/ 插图出行

EmbedPDF的大纲:将文档的书签作为树来显示,跟随,并添加,重命名,移动和删除.

此插件与每个 EmbedPDF 框架包相伴而来 。 从您使用的那个导入 :

在反应中

文件的大纲是其目录:标题:项目,嵌入,每件都到 文档。 Acrobat称物品为书签. 登记册 outlinePlugin() 在你的UI中显示它:

outline-list.tsx

import { useOutline, useOutlineState } from '@embedpdf/react/outline';

export function OutlineList() {
  const outline = useOutline();
  const { rows, current } = useOutlineState();

  return (
    <ul role="tree">
      {rows.map(({ item, depth, hasChildren, expanded }) => (
        <li
          key={item.ref.objectNumber}
          role="treeitem"
          aria-level={depth + 1}
          aria-expanded={hasChildren ? expanded : undefined}
          aria-current={item.ref.objectNumber === current?.objectNumber ? 'location' : undefined}
          style={{ paddingInlineStart: depth * 16 }}
        >
          {hasChildren && (
            <button onClick={() => outline.toggle(item.ref)}>{expanded ? '▾' : '▸'}</button>
          )}
          <button onClick={() => outline.activate(item.ref)}>{item.title}</button>
        </li>
      ))}
    </ul>
  );
}

什麽 useOutlineState() 自己给您更新:在您自己修改后,并共享 文档,在别人的。 文档打开时不读: 大纲加载第一个 时间有需要,所以一个文件 没有人显示成本的概要.

许可证

阿帕奇 - 2.0