eltable中实现滑动鼠标滚轮表格横向滚动_el-table设置横向滚动

首先eltable标签加上属性

ref="table"

再在methods中定义两个方法，分别是：

scrollFunction() {
    this.$refs.table.$el.addEventListener('DOMMouseScroll', this.mouseScroll(), false)
    this.$refs.table.$el.onmousewheel = this.mouseScroll()
},

mouseScroll() {
        return () => {
            let e = window.event || document.all ? window.event : arguments[0] ? arguments[0] : event
            let detail, moveForwardStep, moveBackStep
            let step = 0
            if (e.wheelDelta) {
                detail = e.wheelDelta
                moveForwardStep = -1
                moveBackStep = 1
            } else if (e.detail) {
                detail = event.detail
                moveForwardStep = 1
                moveBackStep = -1
            }
            step = detail > 0 ? moveForwardStep * 100 : moveBackStep * 100
            e.preventDefault()
            let oldScrollLeft = this.$refs.table.$el.getAttribute('data-scroll-left')
if (Number(oldScrollLeft) + step < 4240 && Number(oldScrollLeft) + step >= 0){
   this.$refs.table.$el.setAttribute('data-scroll-left',Number(oldScrollLeft) + step)
   this.$refs.table.setScrollLeft(Number(oldScrollLeft) + step)
}

        }
    },

第二个方法中的‘4020’是表格向右移动的最大距离，需要根据实际情况进行修改，最后在mounted中调用this.scrollFunction()方法即可实现滚坤操作表格横向滚动。