简单记录一下

/**
 * 
 * @param {*} list 表格数据
 * @param {*} id 根据什么来定位
 * @param {*} tableRef 表格实例
 */
export const tableScroll = (list,id,tableRef) => {
    // 首先获取所有的行row的高度
    const rowHeightList = []; //存放所有元素的高度[50.53.51],每一行的高度都可能不同
    const temp = document.getElementsByClassName("el-table__row");
    for (let i = 0; i < temp.length; i++) {
      const item = temp[i];
      rowHeightList.push(item.scrollHeight);
    }
    let itemRow = {}; //存放当前行的所有数据
    let rowIndex = 0; //选中行位于第几行
    for (let i = 0; i < list.length; i++) {
      const item = list[i];
      // 判断查询的数据是否存在,存在则进行定位操作
      if (item.id == id) {
        itemRow = item;
        rowIndex = i;
        break;
      }
    }
    let totalHeight = 0; //求出选中行之前的的高度之和,需要注意的是,当前行的高度不能包含进去
    for (let index = 0; index < rowHeightList.length; index++) {
      const row = rowHeightList[index];
      if (index < rowIndex) {
        totalHeight += row;
      }
    }
    // 滚动到指定行
    tableRef.value.setScrollTop(totalHeight);
    tableRef.value.setCurrentRow(itemRow);
  }

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐