最近发现这个插件用的比较多，自己记录下，以便自己查阅；
基本的使用方法
$ npm install perfect-scrollbar
然后在页面引用
import PerfectScrollbar from 'perfect-scrollbar';
获取dom节点，初始化scrollbar
const container = document.querySelector('#container');
const ps = new PerfectScrollbar(container);
或者
const ps = new PerfectScrollbar('#container');
ps.update() 和 ps.destroy()更新和销毁滚动；自己根据情况使用
下面介绍一些参数
使用方法
const ps = new PerfectScrollbar('#container', {
wheelSpeed: 2,
wheelPropagation: true,
minScrollbarLength: 20
});
handlers {String[]}
它是滚动元素的处理程序列表。
默认值：[‘click-rail’, ‘drag-thumb’, ‘keyboard’, ‘wheel’, ‘touch’]
wheelSpeed {Number}
滚动速度应用于鼠标滚轮事件。
默认值：1
wheelPropagation {Boolean}
如果此选项为true，则当滚动到达边的末尾时，mousewheel事件将传播到父元素。
默认值：false
swipeEasing {Boolean}
如果此选项为true，则会轻松滑动滚动。
默认值：true
minScrollbarLength {Number?}
设置为整数值时，滚动条的滑块部分将不会缩小到该像素数以下。
默认值：null
maxScrollbarLength {Number?}
设置为整数值时，滚动条的滑块部分不会在该像素数上展开。
默认值：null
scrollingThreshold {Number}
这样就设置了threashold ps–scrolling-x和ps–scrolling-y类。在默认的CSS中，无论悬停状态如何，它们都会显示滚动条。单位是毫秒。
默认值：1000
useBothWheelAxes {Boolean}
设置为true时，只能看到一个（垂直或水平）滚动条，则垂直和水平滚动都会影响滚动条。
默认值：false
suppressScrollX {Boolean}
设置为true时，无论内容宽度如何，X轴上的滚动条都将不可用。
默认值：false
suppressScrollY {Boolean}
设置为true时，无论内容高度如何，Y轴上的滚动条都将不可用。
默认值：false
scrollXMarginOffset {Number}
在不启用X轴滚动条的情况下，内容宽度可以超过容器宽度的像素数。允许一些“摆动空间”或“偏移中断”，因此仅因为几个像素而未启用X轴滚动条。
默认值：0
scrollYMarginOffset {Number}
在不启用Y轴滚动条的情况下，内容高度可以超过容器高度的像素数。允许一些“摆动空间”或“偏移中断”，因此仅因为几个像素而未启用Y轴滚动条。
默认值：0
参数这么多，我也没用过，你牛你来用；
下面是滚动的一些事件：
基础用法：
container.addEventListener （' ps-scroll-x '，（） => { }）
ps-scroll-y
当y轴向任一方向滚动时，此事件将触发。
ps-scroll-x
当x轴向任一方向滚动时，此事件将触发。
ps-scroll-up
向上滚动时会触发此事件。
ps-scroll-down
向下滚动时会触发此事件。
ps-scroll-left
滚动到左侧时会触发此事件。
ps-scroll-right
滚动到右侧时会触发此事件。
ps-y-reach-start
滚动到达y轴的开头时会触发此事件。
ps-y-reach-end
当滚动到达y轴的末尾时，此事件将触发（对于无限滚动非常有用）。
ps-x-reach-start
滚动到达x轴的起点时会触发此事件。
ps-x-reach-end
滚动到达x轴末端时会触发此事件。
**还可以在自己的函数中使用 ps.reach.x ,和 ps.reach.y 判断水平和垂直的滚动的位置；返回start和end；与自己的函数融合；