How do I change the dropdown icon in material-ui select field?

reactjs dropdown material-ui
CKA picture CKA · Apr 24, 2018 · Viewed 13.9k times · Source

I am using material-ui select field. I want to change the given drop down icon to a different font icon. How to achieve this? I don't see any option to over-ride this style

Answer

Yevgeni Makarovich picture Yevgeni Makarovich · Apr 26, 2019

Nowadays, the best way as for me, it's just

import Select from '@material-ui/core/Select';
import Person from '@material-ui/icons/Person';
 <Select
   IconComponent = {Person}
 />

Works perfectly without any css additions.

Related questions

Warning: Use the 'defaultValue' or 'value' props on <select> instead of setting 'selected' on <option>

SCENARIO A user has a dropdown and he selects an option. I want to display that dropdown and make that option a default value which was selected by that user last time. I am using selected attribute on option but …

Read More
How do I get the Materialize select dropdown to work with React?

Adding the following template code provided by Materialize doesn't immediately work in a React component: <div class="input-field col s12"> <select> <option value="" disabled selected>Choose your option</option> <option value="1"&…

Read More
Can you force a React component to rerender without calling setState?

I have an external (to the component), observable object that I want to listen for changes on. When the object is updated it emits change events, and then I want to rerender the component when any change is detected. With …

Read More