d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-06-07 15:10:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

toc 目录

Browse Source
This commit is contained in:
tangly1024.com
2023-02-08 17:04:59 +08:00
parent d10bcbe5c3
commit 74c88c748c
2 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
themes/medium/components/Catalog.js
View File

@@ -28,6 +28,7 @@ const Catalog = ({ toc }) => {
const throttleMs = 100 const throttleMs = 100
const actionSectionScrollSpy = React.useCallback(throttle(() => { const actionSectionScrollSpy = React.useCallback(throttle(() => {
console.log('滚动')
const sections = document.getElementsByClassName('notion-h') const sections = document.getElementsByClassName('notion-h')
let prevBBox = null let prevBBox = null
let currentSectionId = activeSection let currentSectionId = activeSection
@@ -51,6 +52,7 @@ const Catalog = ({ toc }) => {
} }
setActiveSection(currentSectionId) setActiveSection(currentSectionId)
const index = tocIds.indexOf(currentSectionId) || 0 const index = tocIds.indexOf(currentSectionId) || 0
console.log(tRef?.current)
tRef?.current?.scrollTo({ top: 28 * index, behavior: 'smooth' }) tRef?.current?.scrollTo({ top: 28 * index, behavior: 'smooth' })
}, throttleMs)) }, throttleMs))

5
themes/medium/components/TocDrawer.js
View File

@@ -18,10 +18,9 @@ const TocDrawer = ({ post, cRef }) => {
{/* 侧边菜单 */} {/* 侧边菜单 */}
<div <div
className={(tocVisible ? 'animate__slideInRight ' : ' -mr-72 animate__slideOutRight') + className={(tocVisible ? 'animate__slideInRight ' : ' -mr-72 animate__slideOutRight') +
' shadow-card h-56 overflow-y-hidden' + ' overflow-y-hidden shadow-card w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-600'}>
' w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-600'}>
{post && <> {post && <>
<div className='dark:text-gray-400 text-gray-600'> <div className='dark:text-gray-400 text-gray-600 h-56'>
<Catalog toc={post.toc}/> <Catalog toc={post.toc}/>
</div> </div>
</>} </>}