mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-14 07:26:52 +00:00
fix sth.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useRouter } from 'next/router'
|
||||
import React from 'react'
|
||||
import { useEffect } from 'react'
|
||||
|
||||
/**
|
||||
* 侧边栏抽屉面板,可以从侧面拉出
|
||||
@@ -8,7 +8,7 @@ import React from 'react'
|
||||
*/
|
||||
const SideBarDrawer = ({ children, isOpen, onOpen, onClose, className }) => {
|
||||
const router = useRouter()
|
||||
React.useEffect(() => {
|
||||
useEffect(() => {
|
||||
const sideBarDrawerRouteListener = () => {
|
||||
switchSideDrawerVisible(false)
|
||||
}
|
||||
@@ -38,7 +38,7 @@ const SideBarDrawer = ({ children, isOpen, onOpen, onClose, className }) => {
|
||||
}
|
||||
|
||||
return <div id='sidebar-wrapper' className={' block md:hidden top-0 ' + className }>
|
||||
<div id="sidebar-drawer" className={`${isOpen ? 'ml-0 w-56 visible' : '-ml-60 max-w-side invisible'} bg-white dark:bg-gray-900 shadow-black shadow-lg flex flex-col duration-300 fixed h-full left-0 overflow-y-scroll scroll-hidden top-0 z-30`}>
|
||||
<div id="sidebar-drawer" className={`${isOpen ? 'ml-0 w-60 visible' : '-ml-60 max-w-side invisible'} bg-white dark:bg-gray-900 shadow-black shadow-lg flex flex-col duration-300 fixed h-full left-0 overflow-y-scroll scroll-hidden top-0 z-30`}>
|
||||
{children}
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useCallback, useRef } from 'react'
|
||||
import React, { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import throttle from 'lodash.throttle'
|
||||
import { uuidToId } from 'notion-utils'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
@@ -13,7 +13,7 @@ const Catalog = ({ toc }) => {
|
||||
const { locale } = useGlobal()
|
||||
|
||||
// 监听滚动事件
|
||||
React.useEffect(() => {
|
||||
useEffect(() => {
|
||||
window.addEventListener('scroll', actionSectionScrollSpy)
|
||||
actionSectionScrollSpy()
|
||||
return () => {
|
||||
@@ -26,7 +26,7 @@ const Catalog = ({ toc }) => {
|
||||
const tocIds = []
|
||||
|
||||
// 同步选中目录事件
|
||||
const [activeSection, setActiveSection] = React.useState(null)
|
||||
const [activeSection, setActiveSection] = useState(null)
|
||||
const throttleMs = 200
|
||||
const actionSectionScrollSpy = useCallback(throttle(() => {
|
||||
const sections = document.getElementsByClassName('notion-h')
|
||||
|
||||
@@ -35,14 +35,14 @@ export const MenuItemCollapse = ({ link }) => {
|
||||
|
||||
{!hasSubMenu && <Link href={link?.to}>
|
||||
<div className='my-auto items-center justify-between flex '>
|
||||
<i className={`${link.icon} w-4 mr-6 text-center`} />
|
||||
{link.icon && <i className={`${link.icon} w-4 mr-6 text-center`} />}
|
||||
<div >{link.name}</div>
|
||||
</div>
|
||||
{link.slot}
|
||||
</Link>}
|
||||
|
||||
{hasSubMenu && <div onClick={hasSubMenu ? toggleOpenSubMenu : null} className='my-auto items-center w-full justify-between flex '>
|
||||
<div className=''>{link?.name}</div>
|
||||
<div className=''><i className={`${link.icon} w-4 mr-6 text-center`} />{link?.name}</div>
|
||||
<i className={`px-2 fas fa-chevron-left transition-all duration-200 ${isOpen ? '-rotate-90' : ''}`}></i>
|
||||
</div>}
|
||||
</div>
|
||||
@@ -50,9 +50,9 @@ export const MenuItemCollapse = ({ link }) => {
|
||||
{/* 折叠子菜单 */}
|
||||
{hasSubMenu && <Collapse isOpen={isOpen}>
|
||||
{link.subMenus.map(sLink => {
|
||||
return <div key={sLink.id} className='cursor-pointer dark:text-gray-200 w-full font-extralight dark:bg-black text-left px-10 justify-start bg-gray-100 hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
|
||||
return <div key={sLink.id} className='cursor-pointer whitespace-nowrap dark:text-gray-200 w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100 hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
|
||||
<Link href={sLink.to}>
|
||||
<span className='text-sm'>{sLink.title}</span>
|
||||
<span className='text-sm'><i className={`${sLink.icon} w-4 mr-3 text-center`} />{sLink.title}</span>
|
||||
</Link>
|
||||
</div>
|
||||
})}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useRef } from 'react'
|
||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import throttle from 'lodash.throttle'
|
||||
import { uuidToId } from 'notion-utils'
|
||||
import Progress from './Progress'
|
||||
@@ -15,10 +15,10 @@ const Catalog = ({ toc }) => {
|
||||
// 目录自动滚动
|
||||
const tRef = useRef(null)
|
||||
// 同步选中目录事件
|
||||
const [activeSection, setActiveSection] = React.useState(null)
|
||||
const [activeSection, setActiveSection] = useState(null)
|
||||
|
||||
// 监听滚动事件
|
||||
React.useEffect(() => {
|
||||
useEffect(() => {
|
||||
window.addEventListener('scroll', actionSectionScrollSpy)
|
||||
actionSectionScrollSpy()
|
||||
return () => {
|
||||
@@ -27,7 +27,7 @@ const Catalog = ({ toc }) => {
|
||||
}, [])
|
||||
|
||||
const throttleMs = 200
|
||||
const actionSectionScrollSpy = React.useCallback(throttle(() => {
|
||||
const actionSectionScrollSpy = useCallback(throttle(() => {
|
||||
const sections = document.getElementsByClassName('notion-h')
|
||||
let prevBBox = null
|
||||
let currentSectionId = activeSection
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useRef } from 'react'
|
||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import throttle from 'lodash.throttle'
|
||||
import { uuidToId } from 'notion-utils'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
@@ -12,7 +12,7 @@ import { useGlobal } from '@/lib/global'
|
||||
const Catalog = ({ post }) => {
|
||||
const { locale } = useGlobal()
|
||||
// 监听滚动事件
|
||||
React.useEffect(() => {
|
||||
useEffect(() => {
|
||||
window.addEventListener('scroll', actionSectionScrollSpy)
|
||||
actionSectionScrollSpy()
|
||||
return () => {
|
||||
@@ -25,9 +25,9 @@ const Catalog = ({ post }) => {
|
||||
const tocIds = []
|
||||
|
||||
// 同步选中目录事件
|
||||
const [activeSection, setActiveSection] = React.useState(null)
|
||||
const [activeSection, setActiveSection] = useState(null)
|
||||
const throttleMs = 200
|
||||
const actionSectionScrollSpy = React.useCallback(throttle(() => {
|
||||
const actionSectionScrollSpy = useCallback(throttle(() => {
|
||||
const sections = document.getElementsByClassName('notion-h')
|
||||
let prevBBox = null
|
||||
let currentSectionId = activeSection
|
||||
|
||||
Reference in New Issue
Block a user