el-table 鼠标滚动，表格内容左右滚动

在项目中有些表格的列特别多，导致滚动条特别长，用户有时候拖拽滚动条不太方便，需要在表格区域内，滚动鼠标，表格的内容，左右滚动。

• 实现的思路也比较简单，对目标表格绑定事件，监听鼠标滚动的事件，对目标元素进行移动

不同的浏览器鼠标的滚动检测事件不一样，分为两种

• e.wheelDelta
• e.detail

当 e.wheelDelta（e.detail）的值大于 0， 表示向左滚动，当 e.wheelDelta（e.detail） 小于 0 时，表示页面向右滚动。

以下是具体的实现：

在页面加载时，绑定监听事件；

mounted() {
    // 给目标表格增加元素 id
    this.$refs.multipleTable.bodyWrapper.id = 'multipleTable'
    // 绑定事件
    this.scrollFunction('', 'multipleTable')
},

methods: {
    scrollFunction(obj, id) {
      obj = document.getElementById(id)
      if (obj.attachEvent) {
        // attachEvent方法，为某一事件附加其它的处理事件
        // attachEvent 是后绑定先执行，addEventListener 是先绑定先执行
        obj.attachEvent('onmousewheel', this.mouseSroll(obj))
      } else if (obj.addEventListener) {
        obj.addEventListener('DOMMouseScroll', this.mouseSroll(false))
      }
      obj.onmousewheel = obj.onmousewheel = this.mouseSroll(obj)
    },
    // 鼠标滚动方法
    mouseSroll(obj, callback) {
      return function() {
        // 获取目标事件
        const e = window.event || document.all ? window.event : arguments[0] ? arguments[0] : evnet
        let detail, moveForwardStep, moveBackStep
        let step = 0
        if (e.wheelDelta) {
          detail = e.wheelDelta
          moveForwardStep = -1
          moveBackStep = 1
        } else if (e.detail) {
          detail = e.detail
          moveForwardStep = 1
          moveBackStep = -1
        }
        step = detail > 0 ? moveForwardStep * 100  : moveBackStep * 100

        e.preventDefault()
        obj.scrollLeft = obj.scrollLeft + step
        // obj.scrollTop = obj.scrollLeft + step
        // 当 wheelDelta 小于零时，鼠标向右滚动，
        // 当 wheelDelta 大于 0 时，鼠标时向左滚动
        if (obj.scrollLeft === 0 && e.wheelDelta > 0) {
          // obj.scrollTop = obj.scrollTop + step
          console.log('右边达到顶点 --------')
        } else if ((obj.clientWidth + obj.scrollLeft) >= obj.scrollWidth  && e.wheelDelta < 0) {
          console.log('z左 --------边达到顶点 --------')
        }
        // obj.scrollTop = obj.scrollTop + step
        console.log('  obj.scrollLeft  ',  obj.offsetWidth,  obj.clientWidth, obj.scrollWidth, e.wheelDelta, obj.scrollLeft)
      }
    },

}