因此，我尝试在单击图标按钮后触发一个弹出菜单。
我使用的是MUI，
所以我复制了演示代码来测试它，

<div>
            <IconButton onClick={handleOpenMenu} 
             aria-controls={open ? 'basic-menu' : undefined}
             aria-haspopup="true"
             aria-expanded={open ? 'true' : undefined}
            >
              <MoreVertIcon />
            </IconButton>

            <Menu
              id="demo-positioned-menu"
              aria-labelledby="demo-positioned-button"
              anchorEl={anchorEl}
              open={open}
              onClose={handleMenuClose}
              anchorOrigin={{
                vertical: 'top',
                horizontal: 'left',
              }}
              transformOrigin={{
                vertical: 'top',
                horizontal: 'left',
              }}
            >
              <MenuItem onClick={handleMenuClose}>Profile</MenuItem>
              <MenuItem onClick={handleMenuClose}>My account</MenuItem>
              <MenuItem onClick={handleMenuClose}>Logout</MenuItem>
            </Menu>
            </div>

这里是事件处理程序，

const [anchorEl, setAnchorEl] = useState(null);
  const open = Boolean(anchorEl);
  const handleOpenMenu = (event) => {
    setAnchorEl(event.currentTarget);
  };
  const handleMenuClose = () => {
    setAnchorEl(null);
  };

但是，每当我按下IconButton时，它就会冻结整个UI，并出于某些原因在无限循环中打印我的Firebase OnAuthStateChanges函数。

var unsubscribe = onAuthStateChanged(auth, (user) => {
    if (user) {
      const uid = user.uid;
      console.log(uid)
      setAuthenticated(true)

    } else {

      setAuthenticated(false)

    }
  });

我哪里做错了有什么建议吗