How to disable long click effect on a material-ui button?

Viewed 996

I have this btn with an icon insdie of it i click for a long time it created and undesiered effect around the icon any clue how to remove this action ?

import React from "react";
import ReactDOM from "react-dom";
import Button from "@material-ui/core/Button";
import ViewListIcon from "@material-ui/icons/ViewList";

function App() {
  return (
    <div>
      <Button style={{ MuiButtonBase: { disableRipple: true } }}>
        <ViewListIcon />
      </Button>
    </div>
  );
}

ReactDOM.render(<App />, document.querySelector("#app"));

CodeSandbox

1 Answers

Add disableRipple prop to Button

<Button disableRipple>
  <ViewListIcon />
</Button>
Related