抽屉打开时，material-ui TextField 输入不起作用

Question

我正在使用Material-UI Autcomplete组件（免费独奏版本），一切正常，直到我将响应添加到抽屉中variant={!matchesSM ? 'persistent' : null}。

<Drawer
  className={classes.drawer}
  variant={!matchesSM ? 'persistent' : null}
  anchor="left"
  open={sidebarOpen}
  classes={{
    paper: classes.drawerPaper,
  }}
  onClose={handleDrawerClose}
>

在平板电脑/移动模式下打开侧抽屉时，文本字段输入无响应。

这是一些截图

const textFieldHandler = () => {
  handleDrawerClose();
  inputRef.current.focus();
};

 <TextField
  {...params}
  ref={inputRef}
  onClick={textFieldHandler}
  placeholder="Search input"
  margin="dense"
...

预期行为

在平板电脑/移动设备模式下，当打开抽屉并单击文本字段时，抽屉应关闭且文本字段应获得焦点。

实际行为

当抽屉打开时，自动完成功能不会集中在平板电脑和移动设备上。

我创建了这个实时运行的示例来说明问题：

• 文本字段仅在侧边栏关闭时才起作用

我不明白为什么它不起作用。

关于这个问题有任何反馈吗？

Answer 1

我想我已经找到了更好的解决方案：

感谢 github 上的这篇文章：https://github.com/mui-org/material-ui/issues/16518#issuecomment-625218550

将“disableEnforceFocus”道具添加到 Mui Drawer 可以让其他输入正确聚焦。

<Drawer
  disableEnforceFocus
  {...otherProps}
>