Markdown-Navbar —— 多是最好用的markdown文章導航組件

這多是最實用的markdown文章結構樹組件,使用此組件,你能夠:css

  • 爲讀者顯示文章目錄
  • 點擊目錄跳轉到文章對應內容
  • 分享帶錨點hash值的url給讀者

Best markdown navigation bar for React.git

git repogithub

Install

yarn add markdown-navbar
複製代碼

ornpm

npm install markdown-navbar
複製代碼

Usage

import MarkNav from 'markdown-navbar';
import 'markdown-navbar/dist/navbar.css';

const content = '## Heading One...\n\n## Heading Two...\n';

<MarkNav className="article-menu" source={content} headingTopOffset={80} /> 複製代碼

Screenshots

Screenshots

Options

property type default value use
className string "" The className that defines the outermost container of navbar
source string "" Markdown text content
headingTopOffset number 0 Anchor relative to the top of the window displacement (for the anchor jump)
ordered boolean true Whether the title contains a numerical prefix, such as: 1. 2. 2.2

License

Markdown-Navbar is released under the MIT license.bash

相關文章
相關標籤/搜索