我正在使用Next的链接组件重定向到其他页面，但当我点击它重新加载页面完全根据Next的文档它是如何使用的如下

<Link href='/rute'>
   <a>Contenido</a>
</Link>

我有一个数组中的路由和内容

export const Navheader = [
    {
        id: 1,
        title: 'home',
        link: '/',
    },
    {
        id: 2,
        title: 'laptops',
        link: '/detailPage',
    },
    {
        id: 3,
        title: 'delivery',
        link: '/deliveryPage',
    },

    {
        id: 4,
        title: 'legal active',
        link: '/legalPage',
    },
    {
        id: 5,
        title: 'secure payment',
        link: '/paymentPage',
    },
    
];

具有数组属性的组件

import PropTypes from 'prop-types';
import { useRouter } from 'next/router';
import Link from 'next/link';

const Navitems = ({ navbar }) => {
    const router = useRouter();
    return (
        <>
            <li className='nav-items'>
                <Link href={navbar.link}>
                    <a
                        className={
                            router.pathname == navbar.link
                                ? ' nav-links active'
                                : ' nav-links'
                        }
                    >
                        {navbar.title}
                    </a>
                </Link>
            </li>
        </>
    );
};
Navitems.propTypes = {
    navbar: PropTypes.array.isRequired,
}
export default Navitems;

并在导航最后与我的数组

{
    Navheader.map((navbar) => (
       <Navitems key={navbar.id} navbar={navbar} />
    ))
}

我也有更简单的按钮，在那里同样的事情发生
删除/那是我在类似问题中看到的事情之一，但它不起作用，如果有人知道为什么会发生这种情况，我会感谢你的帮助