React-router 带箭头的页面

Question

我想用图标（“后退”，“前进”）更改菜单页面（在反应路由器中）......

export const ArrowNav = () => {
    const menu = useContext(menuContext);

    return <div className="lmpixels-arrows-nav">
        <NavLink to={"/about"}>
            <div className="lmpixels-arrow-right">
                <i className="lnr lnr-chevron-right"/>
            </div>
        </NavLink>

        <NavLink to="/resume">
            <div className="lmpixels-arrow-left">
                <i className="lnr lnr-chevron-left"/>
            </div>
        </NavLink>
    </div>
}

Answer 1

而不是使用 html css styles 来显示您可能想尝试的图标 ZEFE90A8E604A7C840DE88D0

https://react-icons.github.io/

我特别要避免使用旧的 CSS 样式名称作为您尝试做的图标。 事实上，我更愿意尽我所能避免在 React 中使用 CSS 文件。 因为 React 使用了很多 js 对象，我相信最好练习使用某种 CSS 对象：

https://www.w3schools.com/react/react_css.asp

您遇到的错误可能取决于您如何导入所需的 css 信息。

您可能会觉得有用的更多信息：

https://medium.com/swlh/using-react-router-navlink-to-specify-the-active-element-in-a-navigation-bar-38700ffd4900

希望对你有帮助