如何解决处理并滚动到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 ['0_ref']。current)时,它调出我要对其调用操作的组件的引用, 如此处所示:
console.log(this['0_ref'].current)
因此,我相信引用已创建并关联, 但是当我尝试运行该功能时:
const scroll = () => {
console.log(this['0_ref'].current)
this['0_ref'].current.scrollIntoView({behavior: "smooth"})
}
我收到此错误:
任何帮助或建议将不胜感激。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。