没有参考的 React 中的 ScrollIntoView? [英] ScrollIntoView in React without refs?

问题描述

我需要以编程方式创建一个很大的项目/div列表，我需要为每个项目/div实现scrollIntoView按钮.我知道如何使用 refs.

I have a big list of items / divs that I need to create programmatically, and I need to implement scrollIntoView buttons for each them. I know how to do it with refs.

是否有可能更高效的 refs 替代方案?

Whether there is an alternative to refs that might be more performant?

推荐答案

我相信这样的事情会奏效:

I believe something like this will work:

onScrollClick(ev) {
    ev.target.scrollIntoView();
}

render() {
    return (
           ... <button onClick={this.onScrollClick}>Scroll This Element Into View</button>
      )
}

假设您想将按钮本身滚动到视图中.如果这不是您想要的，则必须具体说明.

That assumes you want to scroll the button itself into view. If that's not what you want, you'll have to be specific.

[edit] 如果它不是元素本身，而是元素的父元素之一，你也可以找到一个带有 javascript apis 的父元素，element.parentElement——你可以使用它多次您需要找到相关元素.

[edit] if it's not the element itself, but one of the elements parents, you can also find a parent with javascript apis, element.parentElement -- you can use that as many times as you need to find the relevant element.

这篇关于没有参考的 React 中的 ScrollIntoView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！