小编Her*_*eus的帖子

Chakra UI React _activeLink 道具不起作用

我使用 UI 库制作 React 应用程序。我使用 React-router-dom v6 作为 Router 和 Chakra UI 作为库。我的应用程序可以正确导航到每个组件。但是,我想让“活跃”链接具有不同的风格。

这是我的标题:

import { Flex, Link, Icon } from '@chakra-ui/react';
import { Link as RouterLink } from 'react-router-dom';

Run Code Online (Sandbox Code Playgroud)

这是我的代码的链接部分:

<Link as={RouterLink} to="/dashboard" p={2} _activeLink={{fontWeight:'bold'}}>
  <Flex justifyContent="flex-start" ml={4} fontSize='1.25rem' alignItems="center">
    <Icon as={FaHome} mr={2} />
    Dashboard
  </Flex>
</Link>
Run Code Online (Sandbox Code Playgroud)

我使用 _activeLink 道具来创建链接的活动类,但它不起作用。我什至尝试更改背景颜色和文本颜色。但一切都没有改变。我不知道我导入库时是否错误,或者我的代码中有其他内容。有人能给我解决这个问题吗?

reactjs react-router-dom chakra-ui

6
推荐指数
1
解决办法
4375
查看次数

标签 统计

chakra-ui ×1

react-router-dom ×1

reactjs ×1