我正在使用Gatsby Smooth Scroll Anchor Links通过导航链接浏览我的网站。期待与此类似的输出：https://codepen.io/jimmynotjim/pen/yELRxQ
此插件可以正常工作，并且只要您单击特定的链接即可滚动。但是，问题在于它没有在单击的元素上放置active类，甚至当您向下滚动到每个元素时，它也应该在导航菜单上告诉您滚动到哪个部分，因此{{1} }班级也必须在那里。
到目前为止，我所做的是将其导入并在我的active上使用它：
navigation.js如果我通过import React from "react"
import { AnchorLink } from "gatsby-plugin-anchor-links";
const data = [
{
id: 1,
text: "Home",
url: "/#home",
},
{
id: 2,
text: "About",
url: "/#about",
},
{
id: 3,
text: "Works",
url: "/#works",
},
{
id: 4,
text: "Services",
url: "/#services",
},
{
id: 5,
text: "Blogs",
url: "/#blogs",
},
{
id: 6,
text: "Contact",
url: "/#contact",
},
]
const tempLinks = data.map(link => {
return (
<li key={link.id}>
<AnchorLink to={link.url}>{link.text}</AnchorLink>
</li>
)
})
export default () => {
return (
<ul>
{tempLinks}
</ul>
)
}
强行放置active类，它将强制所有链接具有该类。在这个问题上有任何解决方法吗？
任何帮助将不胜感激。