【问题标题】:Reach-Routers navigate() with an offset for anchor links?具有锚链接偏移量的到达路由器导航()?
【发布时间】:2020-04-20 17:22:35
【问题描述】:

有办法吗

navigate('/#about')

使用reach-router,但偏移量为-16px? 我找不到任何关于它的东西。

【问题讨论】:

    标签: javascript reactjs gatsby anchor-scroll reach-router


    【解决方案1】:

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

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

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

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

    【讨论】:

      【解决方案2】:

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

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2019-09-27
        • 1970-01-01
        • 2023-01-12
        • 2021-03-20
        • 1970-01-01
        • 2021-03-05
        相关资源
        最近更新 更多