TypeScript-使用键盘导航下拉列表项

如何解决TypeScript-使用键盘导航下拉列表项

我正在开发一个开源项目，并且遇到了一个错误。我无法使用键盘（箭头键/标签）浏览下拉列表项。我已经编写了键盘导航逻辑，但是不确定如何实现它。下面是代码段。

.
.
.

const TopNavPopoverItem: FC<ComponentProps> = ({closePopover,description,iconSize,iconType,title,to}) => {
  const history = useHistory();

  const handleButtonClick = (): void => {
    history.push(to);
    closePopover();
  };

  const useKeyPress = function (targetKey: any) { // where/how am I supposed to use this function?
    const [keyPressed,setKeyPressed] = useState(false);
    function downHandler(key: any) {
      if (key === targetKey) {
        setKeyPressed(true);
      }
    }
    const upHandler = (key: any) => {
      if (key === targetKey) {
        setKeyPressed(false);
      }
    };

    React.useEffect(() => {
      window.addEventListener('keydown',downHandler);
      window.addEventListener('keyup',upHandler);
      return () => {
        window.removeEventListener('keydown',downHandler);
        window.removeEventListener('keyup',upHandler);
      };
    });
    return keyPressed;
  };


  return (
    <button className="TopNavPopoverItem" onClick={handleButtonClick}>
      <Icon className="TopNavPopoverItem__icon" icon={iconType} size={iconSize} />
      <div className="TopNavPopoverItem__right">
        <span className="TopNavPopoverItem__title">{title}</span>
        <span className="TopNavPopoverItem__description">{description}</span>
      </div>
    </button>
  );
};

有任何解决方法或解决方法？ 预先感谢。