基于vue的滚动条
- 代码的运行需要vue环境(同时需要配置scss预处理器)
xScrollbar.vue
核心文件,滚动条的主要逻辑文件xIndicator.vue
指示箭头文件,为滚动条提供指示箭头,长按事件sample.vue
使用示例代码
- 不需要手动去更新滚动条位置和长度,当内容发生变化的时候
- 可以添加指示器
- 当外层容器发生变化时候,可以手动进行update(进行性能优化),或者在滚动的时候自主低频触发update
- 即便滚动条无法正确指示内容位置,也不影响内容的滑动
- 横向滑动
- 更多可配置
- 更多性能优化
element ui
的scrollbar
文件夹中的相关代码