ant-design-vue anchor组件源码解析

  1. 点击link的click事件
    handleScrollTo-> 滚动的距离是:scrollY+eleOffsetTop-(targetOffst/offsetTop)
    即:
    Window.scrollY+ele.getBoundingClientRect().top-ele.ownerDocument.documentElement.clientTop-(targetOffst/offsetTop)

点击link的时候 元素太往上了。 想要距离顶部的菜单栏对齐
scrollY+eleOffsetTop-(targetOffst/offsetTop)
可以修改targetOffst/offsetTop
即:
Ele.距离文档顶部间距-(targetOffst/offsetTop)

2.滚动 link的激活事件
handleScroll->getCurrentActiveLink

Links.push( )->条件是:
ele.getBoundingClientRect().top-container.getBoundingClientRect().top<(targetOffst/offsetTop)+bounds
取最后的一个link

滚动的时候 滚动到底部 最后一个link没有激活
ele.getBoundingClientRect().top-container.getBoundingClientRect().top<(targetOffst/offsetTop)+bounds
可以修改targetOffst/offsetTop和bounds

Ele.距离视口窗口顶部间距<(targetOffst/offsetTop)+bounds

你可能感兴趣的:(ant-design-vue anchor组件源码解析)