Draftjs 提到了带有滚动条的插件

【问题标题】：Draftjs mentions plugin with scrollDraftjs 提到了带有滚动条的插件
【发布时间】：2020-05-21 10:54:15
【问题描述】：

问题是当提及列表弹出有滚动时 keydown/keyup 不起作用，我可以使用鼠标滚动但 keyup/keydown 没有使滚动移动到正确的位置

【问题讨论】：

请分享您初始化提及插件的方式或一些示例代码。

【解决方案1】：

这可以通过自定义入口组件来实现->

   const entryComponent = (props:any) => {
   const { mention, isFocused, searchValue, ...parentProps } = props;
   const entryRef = React.useRef<HTMLDivElement>(null);

   useEffect(() => {
    if (isFocused) {
     if (entryRef.current && entryRef.current.parentElement) {
      entryRef.current.scrollIntoView({
        block: 'nearest',
        inline: 'center',
        behavior: 'auto'
      });
    }} 
   }, [isFocused]);


   return (
    <>      
    <div
      ref={entryRef}
      role='option'
      aria-selected={(isFocused ? 'true' : 'false')}
      {...parentProps}>

      <div className={'mentionStyle'}>
        {mention.name}
      </div>
     </div>
     </> );
   };

【讨论】：