小编Mar*_*ter的帖子

我正在使用@material-ui和 React。我有以下问题：

我有一个输入组件和一个弹出菜单，在鼠标悬停时打开。当菜单打开时，输入组件失去焦点。当菜单关闭时，焦点将恢复到输入组件。

我需要防止焦点恢复到输入元素。

我怎样才能实现这种行为？

import React from "react";
import Button from "@material-ui/core/Button";
import Menu from "@material-ui/core/Menu";
import MenuItem from "@material-ui/core/MenuItem";
import Input from "@material-ui/core/Input";
import { FormControl } from "@material-ui/core";

export default function SimpleMenu() {
  const [anchorEl, setAnchorEl] = React.useState(null);

  const inputRef = React.useRef();

  const handleClick = (event) => {
    setAnchorEl(event.currentTarget);
  };

  const handleClose = () => {
    setAnchorEl(null);
  };

  const handleCloseAndRemoveFocus = () => {
    console.log(inputRef.current);
    if (inputRef.current) inputRef.current.blur();
    setAnchorEl(null);
  };

  return (
    <div>
      <FormControl>
        <Input …