为什么gatsby的Link组件的activeClassName无法用于我的锚链接?

时间:2019-08-16 14:49:53

标签: hyperlink gatsby

因此,我试图创建一个一页站点,并且我只希望导航链接滚动到单击后的锚定链接。我想知道为什么单击这些锚链接时activeClassName不起作用。我注意到的是,单击锚点链接时显示的活动链接是父链接。

我已经尝试过对父链接使用partialActive = {false},但仍然没有任何反应。

这是我的代码:

k

我希望单击后可以突出显示“投资组合”链接,但是突出显示仍保留在“主页”链接上。 url也会更改,但是activeClassName不会从“主页”传输到“组合”。这可能是怎么回事? activeClassName是否不适用于锚链接?

1 个答案:

答案 0 :(得分:0)

Link docs所述,您不能对Gatsby的Link使用哈希:

<Link>navigate都不能用于带有哈希或查询参数的路线导航。如果您需要这种行为,则应该使用锚标签或导入@reach/router包(Gatsby已经依赖于此包)以利用其navigate函数...

还请注意,如果在“ /#portfolio”链接上将partiallyActive设置为true,则鉴于“ /#portfolio”也与“ /”匹配,因此“ /”链接将突出显示。