前端UI相关

sticky.md

滚动吸顶的 js 实现

  useEffect(() => {
    const handle = () => {
      const top = document.documentElement.scrollTop || document.body.scrollTop
      setTabFixed((value: boolean) => {
        console.log(top, value, safeArea().top)
        if (top > headerRef.current?.clientHeight) {
          console.log('set fixed')
          return true
        }

        if (top < headerRef.current?.clientHeight) {
          return false
        }

        return value
      })

    }

    window.addEventListener('scroll', handle)

    return () => {
      window.removeEventListener('scroll', handle)
    }
  }, [])