javascript - 设置material-ui IconButton的悬停样式

根据React Material-UI文档，我有一个可以使用的 Prop hoveredStyle:http://www.material-ui.com/#/components/icon-button

我想将IconButton用于两个目的:

利用其tooltip属性实现可访问性

我可以直接包装Material-UI svg图标

但是，我不希望在悬停时将光标更改为指针(我相信这是默认行为)，因此我将其更改为这样。

import DeleteIcon from 'material-ui/svg-icons/action/delete

const hoveredStyle = {
    cursor: 'initial'
}

render() {
    return (
        <IconButton tooltip="Description here" hoveredStyle={hoveredStyle}>
            <DeleteIcon />
        </IconButton>
    )
}

效果很好，除了我在图标上进入悬停模式的毫秒数之外，在设置为普通鼠标指针之前，我仍然会看到默认的手形指针。我该如何处理？

最佳答案

我刚刚测试了添加光标:默认为IconButton和DeleteIcon的样式，它似乎具有您想要的功能。 (悬停时没有指针光标。)

const noPointer = {cursor: 'default'};
return (
  <div>
    <IconButton tooltip="Description here" style={noPointer}>
      <DeleteIcon style={noPointer} />
    </IconButton>
  </div>
);