- 检查一下是否设置overview
- 检查设置的元素是否是滚动条所在的元素
- 通过获取到节点设置scrollTop看看滚动条是否正确
- 检查完后仍不生效,检查节点是否设置了 scrollbar-color/scrollbar-width 属性
css
【问题4解决方案】
.ant-table-body {
scrollbar-color: auto !important; /* 重置为 auto,让 webkit 伪元素完全接管 */
scrollbar-width: auto !important; /* 重置为 auto */
&::-webkit-scrollbar {
width: 4px !important;
height: 4px !important;
}
&::-webkit-scrollbar-track {
background: transparent !important;
}
&::-webkit-scrollbar-thumb {
background: transparent !important;
border-radius: 2px !important;
}
&::-webkit-scrollbar-button {
display: none !important;
}
}
/* 容器 hover 时显示滚动条 */
&:hover {
.ant-table-body {
&::-webkit-scrollbar-track {
background: var(--Surface-Secondary-50, #f4f4f4) !important;
}
&::-webkit-scrollbar-thumb {
background: var(--Text-Body, #525252) !important;
}
&::-webkit-scrollbar-button {
display: none !important;
}
}
}