vue-滚动条

功能简介

功能比较简陋，仅实现了主要功能，水平滚动条，垂直滚动条，容器高宽改变时动态更改滚动条的大小，自定义颜色，方位等功能可通过添加配置参数实现

一、需要安装 “element-resize-detector”

npm install element-resize-detector

用于监听div宽高变化

二、创建工具类 util.js ，方便事件的绑定以及移除

/**
 * 绑定事件
 *
 * @export
 * @param {any} dom
 * @param {any} eventType
 * @param {any} callback
 */
export function on (dom, eventType, callback) {
    if (document.addEventListener) {
      dom.addEventListener(eventType, callback)
    } else {
      dom.attachEvent('on' + eventType, callback)
    }
  }
  
  /**
  * 解绑事件
  *
  * @export
  * @param {any} dom
  * @param {any} eventType
  * @param {any} callback
  */
  export function off (dom, eventType, callback) {
    if (document.removeEventListener) {
      dom.removeEventListener(eventType, callback)
    } else {
      dom.detachEvent('on' + eventType, callback)
    }
  }

三、创建容器 scroll.vue

四、创建滑块 slider.vue

五、demo