目录
1.锚点无滚动效果
2. 进入页面跳转到指定锚点
1.锚点无滚动效果
背景:使用antd的锚点时,按照官方文档的用法配置之后发现锚点组件的锚点Title位置没办法随着我的页面滚动而变化,但是点击Title跳转具体锚定位置的功能却是没有问题的
解决方法:getContainer绑定滚动范围容器
<a-anchor class="anchor" :get-container="getContainerBox" >
<a-anchor-link v-for="(item,i) in anchorList" :key="i" :href="'#'+item.href">
<template slot="title">
{{item.title}}<span></span>
</template>
</a-anchor-link>
</a-anchor>
getContainerBox() {
return this.$refs.containerBox;
},
2. 进入页面跳转到指定锚点
location.hash = 'mapV'
上面效果可用下方代码同样实现
document.getElementById("mapV").scrollIntoView();