如何在 spring RestDoc（asciidoc）中折疊 TOC（目錄）？

Question

我使用過 SpringRestDoc 並想折疊目錄。

在我的index.adoc下面

= Service Rest Docs API Document
:doctype: book
:icons: font
:source-highlighter: highlightjs
:toc2: left
:theme: flatly
:toclevels: 1
:sectlinks:

[[introduction]]

== information

----
Spring Rest Document
----

...

謝謝，

Answer 1

Asciidoctor 的默認模板不包含展開/折疊 ToC 的功能。 您需要添加自己的 CSS/JavaScript 來實現該目標。

最簡單的方法是使用“docinfo”文件。 有關詳細信息，請參閱https://docs.asciidoctor.org/asciidoctor/latest/docinfo/ 。

這是一個非常簡單的實現，演示了這個概念：

1. 在您的文檔中，在 header 中（例如，就在:doctype:屬性定義下方），添加行:docinfo: shared 。

2. 在與您的文檔相同的文件夾中創建一個名為“docinfo.html”的文件； 此文件包含您的自定義 CSS 和 JavaScript。

3. 在docinfo.html文件中添加以下內容：

    <style> button.tocSwitch { position: absolute; top: 0; left: 0; } </style> <script> document.addEventListener('DOMContentLoaded', function () { var target = document.querySelector('#header') var button = document.createElement('button') button.className = 'tocSwitch' button.innerHTML = 'ToC' button.addEventListener('click', function (e) { e.stopPropagation() var toc = document.querySelector('#toc') var body = document.querySelector('body') if (body.classList.contains('toc2')) { body.classList.remove('toc2') body.classList.remove('toc-left') toc.style.display = 'none' } else { body.classList.add('toc2') body.classList.add('toc-left') toc.style.display = 'block' } }) target.appendChild(button) }) </script>

This content defines some CSS styling for a button, and some JavaScript the dynamically creates the button, adds the button to the header of the page, and an event listener such that when you click the button, the appropriate class name and CSS style adjustments are用於顯示/隱藏 ToC。