const Index = () => {
// Ref Links
const frefLinks = {
  1: useRef(1),
  2: useRef(2),
  3: useRef(3),
  4: useRef(4),
  5: useRef(5),
};

const scrollLink = (i) => {
  let frefLink = frefLinks[i];
  return frefLink.current.scrollIntoView({
    block: "start",
    behavior: "smooth"
  });
};

trở lại (
  
    
    <>
          scrollToLinkA={() => { scrollLink(1) }}
          scrollToLinkB={() => { scrollLink(2) }}
          scrollToLinkC={() => { scrollLink(3) }}
          scrollToLinkD={() => { scrollLink(4) }}
          scrollToLinkE={() => { scrollLink(5) }}
    />
     e.deltaY <= 0 ? console.log('up') : scrollLink(2) }/>
     e.deltaY <= 0 ? scrollLink(1) : scrollLink(3) }/>
     e.deltaY <= 0 ? () => { scrollLink(2) } : () => { scrollLink(4) } }/>
     e.deltaY <= 0 ? scrollLink(3) :scrollLink(5) }/>
     e.deltaY <= 0 ? scrollLink(4) :console.log('down')}/>
  
);
}

scrollToLinkA 到 E 是嵌套 div 的 onClick 事件。 它非常适合 onclick，onWheel 在该部分的嵌套 div 中是正确的。 div onWheel = {onwheel} 但是，尽管 console.log 仍然有效，但 onwheel 事件不会触发滚动功能。我尝试了正常调用该函数和通过 Sect3 轮子上的箭头，但仍然失败。

我在react+onwheel+scrollintoview上进行了足够的搜索，但我真的找不到任何适用的答案。我没有考虑 onscroll，只是 onwheel 就是我想要的。

我真的想重用scrollLink函数，而不是添加额外的窗口监听器事件或依赖项。请指教。

câu trả lời hay nhất

我无法判断scrollLink 函数是否不是由onWheel 调用的，但我可以100% 确定scrollLink 可以正常工作，因为它来自onClick。我将 console.log 放入scrollLink 中，它也会记录。

我有导航和部分。 nav的div的onClick触发scrollLink函数并且scrollintoview工作完美。现在我正在执行部分 div 的 onWheel 事件来触发相同的“scrollLink”函数，它没有响应，但 console.log 到处都在工作。

我无法再发表评论，所以我在这里发帖。

关于javascript - React onwheel 不执行现有的scrollintoview 但 onclick 能够，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58894491/