javascript - 我可以禁用 Material-UI SpeedDial 鼠标悬停事件吗
问题描述
我想禁用 Material-UI 的 SpeedDial 组件 ( https://material-ui.com/api/speed-dial/ ) 的默认鼠标悬停/悬停行为。目前,当您将鼠标悬停在主图标上时,SpeedDial 组件将打开。它也将在单击时打开。这给我们的一些用户带来了问题,因为当他们将鼠标悬停在按钮上时 - 它会打开 - 他们会立即单击并关闭。
我想保留为触摸屏设备打开 SpeedDial 的单击操作。
有没有一种简单的方法可以禁用悬停/鼠标悬停事件?据我所知,API 不允许这样做。
谢谢!
解决方案
这种行为可以通过忽略onOpen
prop 并用 prop 控制组件来实现onClick
。
// Component code
const [open, setOpen] = React.useState(false);
const handleOpen = (event) => {
setOpen(!open);
};
return (
<SpeedDial
onClick={handleOpen}
open={open}
...
/>
);
您可以在这里看到一个工作示例:https ://codesandbox.io/s/material-demo-1lwci
推荐阅读
- html - Angular 6, ngFor identifier not defined
- java - Interchange character in String
- python - How do I extract characters from one file based on header and values in a list in python?
- laravel - when i run migration command using (laravel 5.7) this happend, How to solve?
- c - 在scanf()中单独输入?
- javascript - 使用最佳搜索算法自动建议号码?
- r - R 不能删除 NA 列,尝试了几种方法
- algorithm - Lisp gethash complexity
- javascript - React setState reading as undefined after filtering through API response
- android - 如果选中,则获取复选框以输出是,如果未选中则输出否