/
githubmirror
/
quill
Обзор
Документация
Войти
/
githubmirror
/
quill
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
packages/website/src/components/ActiveLink.jsx
44 строки
1 KB
Jason Chen
Update website for 2.0 (#4121)
18 апр 2024, 05:48
Не верифицирован
18 апр 2024, 05:48
3454595
Код
Авторство
О чём код?
import { useRouter } from 'next/router'; import Link from 'next/link'; import React, { useState, useEffect, useCallback } from 'react'; const ActiveLink = ({ children, activeClassName, className = '', activePath, ...props }) => { const { asPath, isReady } = useRouter(); const getClassName = useCallback(() => { // Using URL().pathname to get rid of query and hash const activePathname = asPath; const isActive = activePath ? activePathname.startsWith(activePath) : linkPathname === activePathname; return isActive ? `${className} ${activeClassName}`.trim() : className; }, [asPath, activePath, className, activeClassName]); const [computedClassName, setComputedClassName] = useState(getClassName()); useEffect(() => { // Check if the router fields are updated client-side if (isReady) { const newClassName = getClassName(); if (newClassName !== computedClassName) { setComputedClassName(newClassName); } } }, [isReady, computedClassName, getClassName]); return ( <Link className={computedClassName} {...props}> {children} </Link> ); }; export default ActiveLink;