el-table 实现按住鼠标左键拖动横向滚动条_el-table自由拖动滚动条

<el-table ref="cesTable" @mousedown.native="mouseDownHandler" @mouseup.native="mouseUpHandler" @mousemove.native="mouseMoveHandler">
</el-table>
 
  data() {
    return {
      mouseFlag: false,
      mouseOffset: 0,
    };
  },
 
methods: {
    mouseDownHandler(e) {
      this.mouseOffset = e.clientX;
      this.mouseFlag = true;
    },
    mouseUpHandler(e) {
      this.mouseFlag = false;
    },
    mouseMoveHandler(e) {
      // 这里面需要注意，通过ref需要那个那个包含table元素的父元素
      let divData = this.$refs.cesTable.bodyWrapper;
      if (this.mouseFlag) {
        // 设置水平方向的元素的位置
        divData.scrollLeft -= (- this.mouseOffset + (this.mouseOffset = e.clientX));
      }
    },
}