处理并滚动到react中动态创建的引用

问题描述

我正在尝试创建目录，如果单击列表项/按钮，它将滚动到页面中的该位置，

我正在使用一个类组件，并从导入的json项目数组中创建引用，

 constructor(props) {
    super(props)

    projects.forEach(p => {
        this[`${p.id}_ref`] = React.createRef()
    })
}

我可以在这里的地图功能中分配参考：

 techCards = projects.map(p => (
        <TechCard key={p.id} *ref={this[`${p.id}_ref`]}* href={p.href} name={p.name} github= 
        {p.github} technologies={p.technologies} description={p.description} disclaimer= 
        {p.disclaimer} />
    ))

然后，当我尝试访问ref并在其上调用scrollIntoView（{behavior：“ smooth”）}}时，问题就出现了，

我知道正在创建和分配引用，因为当我在onClick函数中使用console.log（this）时，会得到以下输出：

console.log(this)，

当我console.log（this ['0_ref']。current）时，它调出我要对其调用操作的组件的引用， 如此处所示：

console.log(this['0_ref'].current)

因此，我相信引用已创建并关联， 但是当我尝试运行该功能时：

const scroll = () => {
            console.log(this['0_ref'].current)
            this['0_ref'].current.scrollIntoView({behavior: "smooth"})
        }

我收到此错误：

onClick error

任何帮助或建议将不胜感激。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）