el-table 动态滚动到指定行和指定列

滚动到表格某一列

/**
 *  el-table滚动到表格某一列
 *  @param {object} tableElement  表格元素(this.$refs['表格ref值'])
 *  @param {Number} columnIndex   滚动到第几列(从0开始)
 *  @param {Number} fixedNum   表格左侧固定列个数(没有固定列,可不传)

 */
const tableScrollToColumn = (tableElement, columnIndex, fixedNum = 0) => {
  const theTableRow = tableElement.bodyWrapper.querySelector('.el-table__body tbody .el-table__row')
  let scrollLeft = 0
  for (let i = fixedNum; i < theTableRow.children.length; i++) {
    if (i == columnIndex) {
      break
    }
    scrollLeft += theTableRow.children[i].offsetWidth
  }
  tableElement.bodyWrapper.scrollLeft = scrollLeft
}

调用示例

tableScrollToColumn(this.$refs.editTable, 7, 1)

滚动到表格某一行

/**
 *  el-table滚动到表格某一行
 *  @param {object} tableElement  表格元素(this.$refs['表格ref值'])
 *  @param {Number} rowIndex   滚动到第几行(从0开始)
 */
const tableScrollToRow = (tableElement, rowIndex) => {
  const theTableRows = tableElement.bodyWrapper.querySelectorAll('.el-table__body tbody .el-table__row')
  let scrollTop = 0
  for (let i = 0; i < theTableRows.length; i++) {
    if (i === rowIndex) {
      break
    }
    scrollTop += theTableRows[i].offsetHeight
  }
  tableElement.bodyWrapper.scrollTop = scrollTop
}

调用示例

tableScrollToRow(this.$refs.editTable, 6)