antd的Anchor锚点组件为什么没有随着页面滚动变化？

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第9天，点击查看活动详情。

之前自己使用antd组件库的Anchor组件时遇到了一个问题，就是按照官方文档的用法配置组件之后发现我的Anchor锚点组件的锚点Title位置没办法随着我的页面滚动而变化。

但是点击Title跳转具体锚定位置的功能却是没有问题的

经过网上的一些资料搜索以及自己对API的实践，最终找到了问题所在，这里的Anchor组件有一个target属性，需要修改该属性来修改Anchor组件监听的滚动区域，默认情况下是监听body的滚动

但是恰恰我们的业务场景下body是不滚动的而是Anchor的父组件进行滚动，所以其实我们可以尝试重新定义target属性来解决：

<Content id="wy-anchor-Content">

<Anchor>

{ anchorList.map(item => (

<Link key={`${item.index}${item.next}`}

href={`#anchor-${item.index}${item.next}`}

title={item.title ? item.title : '默认信息'} />

))

}

</Anchor>

</Content>

尝试修改之后：

<Content id="wy-anchor-Content">

<Anchor target={() => document.getElementById('wy-anchor-Content')}>

{ anchorList.map(item => (

<Link key={`${item.index}${item.next}`}

href={`#anchor-${item.index}${item.next}`}

title={item.title ? item.title : '默认信息'} />

))

}

</Anchor>

</Content>

不过后面去看了下官方的文档，发现似乎目前版本并没有target属性，目前支持的API包括，可能是因为新版本已经不支持了吧，不过试了下还是有用的：

affix	固定模式	boolean	true
bounds	锚点区域边界	number	5
getContainer	指定滚动的容器	() => HTMLElement	() => window
getCurrentAnchor	自定义高亮的锚点	() => string	-
offsetTop	距离窗口顶部达到指定偏移量后触发	number
showInkInFixed	affix={false} 时是否显示小圆点	boolean	false
targetOffset	锚点滚动偏移量，默认与 offsetTop 相同，例子	number	-
onChange	监听锚点链接改变	(currentActiveLink: string) => void	-
onClick	click 事件的 handler	function(e: Event, link: Object)	-