ant design 锚点采坑一无滚动效果

最新推荐文章于 2025-10-06 03:09:29 发布

转载

最新推荐文章于 2025-10-06 03:09:29 发布 · 9.4k 阅读

4 ·

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5c7de7b2e51d457c54732d0e

文章标签：

#javascript #java #移动开发 #ViewUI

在Ant Design中实现目录与内容关联的锚点滚动时遇到问题，页面无滚动效果。可能的原因包括未设置目标区域高度以及内容超出屏幕但未出现滚动条。解决此类问题的关键在于正确设置相关区域的样式属性。

本次目标是类似于目录和内容关系指定区域进行滚动

无效原因猜测：没有设置目标区域的高度以及超出之后出现滚动条

<Row gutter={16}>
   <Col span={6}>
      <Card title="目录" bordered={
   
   false}>    

          // 设置指定目标容器  记得带上 官方事件  这样就不会 进行路由跳转
         <Anchor onClick={this.handleClick} getContainer={() => document.getElementById('content')}  >
            <Link href="#First"  title="第一章节"  />
            <Link href="#Second" title="第二章节" />
         </Anchor>
      </Card>
   </Col>
   <Col span={4}  >
      <Card title="内容" bordered={
   
   false} >