当前位置: 首页 > 面试题库 >

使用Reactjs获取滚动位置

督德泽
2023-03-14
问题内容

我使用reactjs并想处理带click事件的滚动。

首先,我使用绘制了帖子列表componentDidMount

其次,通过click event按列表中的每个帖子,它将显示帖子详细信息并滚动到顶部(因为我将帖子详细信息置于页面的顶部位置)。

第三,通过单击"close button"帖子详细信息,它将返回以前的帖子列表,但是我希望网站将滚动到要单击的帖子的位置。

我这样使用:

单击事件以查看帖子详细信息:

inSingle = (post, e) => {
   this.setState({
        post: post,
        theposition: //How to get it here?
   });
   window.scrollTo(0, 0);
}

我想获取的状态,theposition然后可以按滚动到所点击帖子的位置'Close event'


问题答案:

这应该工作:

this.setState({
    post: post,
    theposition: window.pageYOffset
});


 类似资料:
  • 问题内容: 我正在尝试使用JavaScript检测浏览器滚动条的位置,以确定当前视图在页面中的位置。我的猜测是,我必须检测轨道上的拇指在哪里,然后检测拇指的高度占轨道总高度的百分比。我是不是过于复杂了,还是JavaScript提供了比这更简单的解决方案?任何想法代码明智? 问题答案: 您可以使用和获取分别滚动的垂直和水平偏移。可如果你关心整个页面。如果需要百分比,可以将其与和(再次可能是主体)进行

  • 我有一个页面的正文在滚动。也就是说,body上的滚动事件侦听器起作用。但是,window和document上的滚动侦听器不会激发。 问题是,即使body是滚动的,$(“body”).scrolltop()始终返回0。我循环遍历了body的所有子级,没有一个scrollTop()大于0。有些孩子有溢出:隐藏,但应该不会影响滚动顶部,我猜。 我删除了高度:100%根据这个问题,我也经历了这个问题。 我

  • 返回当前页面的滚动位置。 如果浏览器支持 pageXOffset 和 pageYOffset ,那么请使用 pageXOffset 和 pageYOffset ,否则请使用 scrollLeft 和 scrollTop 。 你可以省略 el 参数,默认值为 window。 const getScrollPosition = (el = window) => ({ x: el.pageXOffs

  • 问题内容: 我希望找到一种方法来获取当前可见窗口的位置(相对于总页面宽度/高度),以便可以将其强制从一个部分滚动到另一部分。但是,要猜测哪个对象对您的浏览器拥有真正的X / Y,似乎有很多选择。 为了确保IE 6 +,FF 2+和Chrome / Safari能正常工作,我需要选择以下哪两项? 还有其他吗?一旦知道窗口在哪里,就可以设置一个事件链,该事件链将缓慢调用直到到达所需的位置。 问题答案:

  • 问题内容: 是否可以获取当前滚动位置或React Native中组件的当前页面? 所以像这样: 问题答案: 尝试。 然后:

  • 问题内容: 以下HTML将在div.container的右侧边缘显示滚动条。 是否可以确定该滚动条的宽度? 问题答案: 此功能应为您提供滚动条的宽度 基本步骤如下: 创建隐藏的div(外部)并获取其偏移宽度 使用CSS溢出属性强制滚动条显示在div(外部)中 创建新的div(内部)并附加到外部,将其宽度设置为“ 100%”并获得偏移宽度 根据收集的偏移量计算滚动条宽度 更新资料 如果在Window