Using icon components
MUI provides prebuilt SVG icons that we have to install by using the following command in the terminal:
npm install @mui/icons-material
Let's first implement the DELETE button in the grid. The MUI IconButton component can be used to render icon buttons. The @mui/icons-material package that we just installed contains lots of icons that can be used with MUI.
You can find the list of icons available from the MUI documentation. We need an icon for our DELETE button; therefore, we will use an icon called DeleteIcon:
- Open the
Carlist.jsfile and add the following imports:// Carlist.js import IconButton from '@mui/material/IconButton'; import DeleteIcon from '@mui/icons-material/Delete';
- Next, we will render the
IconButtoncomponent in our grid. We will modify the DELETE button in the code where we define the grid columns. We change thebuttonelement to theIconButtoncomponent and renderDeleteIconinside theIconButton...