Reach-Routers navigation()具有锚链接的偏移量?

问题描述 投票:0回答:2

有办法吗

navigate('/#about')

具有reach-router,但具有-16px的偏移量?我还没找到任何东西。

javascript reactjs gatsby anchor-scroll reach-router
2个回答
0
投票

另一个解决方案可能是侦听路由更改,如果URL包含锚点,则调用scroll(0, -16);。参见https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll。也许在调用scroll之后再调用navigate就足够了。


0
投票

您可以像这样将状态传递给链接:

...

navigate(
    "/#about/",
    {
        state: { offset: "-16px" },
    }
)

...

,然后从目标组件访问状态。您可以将其传递到该组件的任何部分。

在此处了解更多信息:https://www.gatsbyjs.org/docs/gatsby-link/#add-state-to-programmatic-navigation

© www.soinside.com 2019 - 2024. All rights reserved.