时间戳

首页 > 解决方案 > 如何设置表格滚动到默认位置

javascript - 如何设置表格滚动到默认位置

问题描述

我有一个包含 100 条记录的表。当我向下滚动表格时（假设有 50 条记录），假设我离开该页面并返回。然后我必须从头开始向下滚动。我想从我离开的地方开始。我正在使用 VueJS。现在我可以使用下面的代码段获取滚动位置

这是我的桌子，

<tbody v-scroll:#scroll-target="updateScrolledPoint">
  <tr>
    <td>{{book.keyword}}</td>
    <td>{{book.avgPages ? book.avgPages : '-'}}</td>
    <td>{{book.avgPages ? book.avgPages : '-'}}</td>
    <td>{{book.noCompetitors}}</td>
  </tr>
</tbody>

这是我获取滚动位置并将其存储为我的自定义缓存的功能，

updateScrolledPoint(e) {
   // Getting the scroll location
   const scrollPosition = e.target.scrollTop;

   // Setting the scrolled location to the cache
   const { activeTab } = this.$props.state.keywordSearch;
   cachedHelper.updateCacheScrollLocation(cachedHelper.SCREEN_TYPE.keywordSearch, activeTab, scrollPosition);
}

我想设置已经存储的滚动位置以在再次加载页面时滚动页面。我相信这是在表中设置值的问题，请帮助我。

标签： javascriptcssvue.js

解决方案

在页面加载时检查缓存中是否有位置，如果位置可用，则可以像这样设置滚动条：-

function setPosition(){
  // getting table element from html dom by id.
  let table = document.getElementById("table");

  // setting top position of scrollbar, scrollLeft is scrollbar of Y-Axis
  return table.scrollLeft = cachePosition;
}

推荐阅读