如何解决反应scrollIntoView不适用于ref
我的反应功能成分定义为
export const NavMenuHorizontal: React.FunctionComponent<NavMenuProps> = (
props
) => {
const selectedItemRef = React.createRef<HTMLDivElement>();
React.useEffect(() => {
selectedItemRef.current?.scrollIntoView({
behavior: "smooth",inline: "center",})
});
return (
<List>
{map(...) => (
<div ref={isActive ? selectedItemRef : undefined}>
some text
</div>
)}
</List>
);
};
//isActive is true for only one item in the map
我正在尝试使用ref使选定的列表项滚动到视图中,但无法获得预期的结果。但是,如果我尝试在钩子上添加调试断点,则它会按预期工作并在视口中滚动元素。
我还尝试将scrollIntoView包裹在setTimeout()内,该方法可以正常工作,但它会多次滚动并导致震颤效果。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。