Цвет Material-Ui по умолчанию — синий. Я покажу вам, как изменить цвет по умолчанию в два этапа.
- Полное изменение цвета по умолчанию.
- Изменить цвет по умолчанию в определенном компоненте.
Прежде всего, создайте свое приложение для реагирования
npx create-реагировать на ваше приложение
Затем установите Material-Ui
npm install @material-ui/core
Шаг 1.
У меня есть два файла в каталоге src. Один из них — основной файл App.js, а второй — demo.js демонстрационный файл. Настройте файл App.js. Так…
И посмотрите мой файл demo.js…
По умолчанию цвет контура текстового поля синий. Так…
После того, как вы следовали моему коду, ваш вывод будет таким:
Здесь я использовал шоколадный цвет.
Помните: Material-Ui не поддерживает название цвета в createTheme. (Пример: красный, желтый, зеленый). Если вы сделаете это, вам может потребоваться импортировать цвет из Material-Ui. Это не рекомендуется. Рекомендуемый способ - использовать шестнадцатеричный код. (Пример: #d2691e)
Шаг 2:
Вы можете изменить цвет по умолчанию в конкретном компоненте. Например, у меня есть файл ChangeColor.jsx в каталоге src.
И конечный результат…
Я попытался объяснить идеально. Это была моя первая статья на Medium. Пожалуйста, поддержите меня комментариями и аплодисментами. И, спасибо, что дочитали до конца.