Material-UI填充图标

Question

I am adding the icon button in form of the start from and I want to fill it on click with solid color.

import StarIcon from '@material-ui/icons/StarBorder'
...
<IconButton><StarIcon className={classes.favoricon}/></IconButton>

I had a look at icon implementation, could not find a class that would control it (check code here ). I could create a separate svg, but maybe there is a better option

Answer 1

I am not sure if there is a better way.

Create a state on the component and modify the state whenever the Component is clicked.

Use onClick function to toggle the state which changes the Component from StarIcon to Star and vice-versa.

 handleChange = () => { const value = this.state.value; this.setState((prev) => ({value: !prev.value})); };