antd Table expandable 加入fixedfalse页面自动滑动怎么解决
如果在使用 antd 的 Table 组件时,设置了 expandable 属性,并且设置了 fixed:false,但是在展开行时页面自动滑动的问题,可以考虑以下解决方案:
- 使用 CSS 解决:可以给 Table 组件所在的父容器添加 overflow:auto 或 overflow:hidden 样式,这样当表格展开时,父容器会出现滚动条,页面不会自动滑动。
.parent-container {
overflow: auto;
/* 或者使用 overflow: hidden; */
}
- 使用 JavaScript 解决:可以在展开行时,使用 JavaScript 控制页面滚动位置,将页面滚动到展开行的位置。
// 获取展开行的位置
const expandRowTop = document.querySelector('.expand-row').getBoundingClientRect().top;
// 滚动页面到展开行的位置
window.scrollTo({
top: expandRowTop,
behavior: 'smooth', // 平滑滚动
});
需要注意的是,以上解决方案仅提供了一种思路,具体实现方式可能需要根据实际情况进行调整
原文地址: https://www.cveoy.top/t/topic/iM4I 著作权归作者所有。请勿转载和采集!