Element Plus 中提供了用于替换浏览器原生滚动条的组件 Scrollbar，在 Ant Design 中并没有此组件。
属性
| Element | 说明 |
|---|---|
| height | 滚动条高度 |
| max-height | 滚动条最大高度 |
| native | 是否使用原生滚动条样式 |
| wrap-style | 包裹容器的自定义样式 |
| wrap-class | 包裹容器的自定义类名 |
| view-style | 视图的自定义样式 |
| view-class | 视图的自定义类名 |
| noresize | 不响应容器尺寸变化，如果容器尺寸不会发生变化，最好设置它可以优化性能 |
| tag | 视图的元素标签 |
| always | 滚动条总是显示 |
| min-size | 滚动条最小尺寸 |
| id | 视图ID |
| role | 视图的角色 |
| aria-label | 视图的 aria-label |
| aria-orientation | 视图的 aria-orientation |
| tabindex | 容器的tabindex |
事件
| Element | 说明 |
|---|---|
| scroll | 当触发滚动事件时，返回滚动的距离 |
| end-reached | 触发滚动结束时的触发器 |
暴露方法
| Element | 说明 |
|---|---|
| handleScroll | 触发滚动事件 |
| scrollTo | 滚动到一组特定坐标 |
| setScrollTop | 设置滚动条到顶部的距离 |
| setScrollLeft | 设置滚动条到左边的距离 |
| update | 手动更新滚动条状态 |
| wrapRef | 滚动条包裹的 ref 对象 |
小结
Element Plus 自定义实现了一个 Scrollbar 滚动条，在 pc 端这个滚动条的封装是否有必要，在不考虑 IE 浏览器的情况下，简单的通过 css 就可以对滚动条实现自定义样式，而 pc 端对事件要求的场景并不多。
参考链接：
发表回复