在生产中使用 usePathname 不起作用

Question

此代码成功根据开发中的 currentPath 将相应导航链接上的字体更改为粗体，但在生产中不起作用。

我正在使用“使用客户端”，并且我拥有所有正确的导入和接口。

function HorizontalList({ links }: HorizontalListProps) {
  const currentPath = usePathname();

  return (
    <List>
      <HStack as="ul" spacing={6} listStyleType="none" m={0} p={0}>
        {links.map((link, index) => (
          <ListItem key={index}>
            <Link
              href={link.href}
              _hover={{}}
              color="belleBlue"
              className={classnames({
                "font-bold": currentPath === link.href,
                "hover:opacity-70 transition-all": true,
              })}
            >
              {link.label}
            </Link>
          </ListItem>
        ))}
      </HStack>
    </List>
  );
}

Answer 1

这行代码解决了我的问题，特别是 {ssr: false}

 const isDesktop = useBreakpointValue({ base: false, md: true }, {ssr: false});