Публикации по теме 'material-ui'


Форма Redux и пример пользовательского интерфейса материала
Использование компонента "Массив полей и таблица" Я расскажу, как заставить Redux Form и Material UI работать в проекте React. Сначала выполните следующую команду, чтобы настроить проект React с именем my-app . create-react-app my-app Затем нам нужно установить эти зависимости: npm i material-ui@next npm i redux-form npm i redux npm i react-redux Я сделал material-ui@next , чтобы установить Material UI 1.0, который находится в стадии бета-тестирования (в зависимости от того,..
Пользовательские переходы CSS с пользовательским интерфейсом React Material
Я часто использую Material-UI для своих проектов на React. Он готов к использованию и имеет широкие возможности настройки. Также легко выбрать только те модули, которые нужны проекту, сохраняя при этом созданные файлы относительно небольшими. В этом случае я хочу описать недокументированную функцию, расположенную в объекте темы: transtions.create() . Он предлагает способ создания свойств CSS для атрибута transition . Давайте немного вспомним, как стили CSS работают в..
Как использовать иконки в Material-UI для создания кнопки
Введение в библиотеку иконок Material-UI Иконки обычно используются на веб-сайтах и ​​в приложениях. Material-UI имеет собственную библиотеку иконок с более чем 1100 иконками на выбор. Все эти значки взяты из официальных значков материалов от Google. В этой статье мы рассмотрим библиотеку значков Material-UI и узнаем, как использовать значки для создания компонента кнопки. Введение в библиотеку иконок Material-UI Библиотека значков Material-UI включает более 1100 значков..
Как исправить компонент Select пользовательского интерфейса материала, не реагирующий на событие клика
Это касается всех, кто пытается написать автоматизированный тест, который нажимает на компонент выбора пользовательского интерфейса материала и по какой-то причине не отображает параметры выбора. Вот причина: компонент Select больше не прослушивает клики, а слушает событие mouseDown. Измените событие click на mouseDown, и вуаля, ваш тест теперь будет иметь доступ к параметрам рендеринга. // bad fireEvent . click ( getByText ('Select component'); // good fireEvent . mouseDown (..
Реагировать на операции CRUD с таблицей материалов с данными RESTful API
Научитесь выполнять операции CRUD в нескольких строках кода с помощью таблицы материалов. Привет, ребята, добро пожаловать в мой первый учебник react.js 😊 Я собираюсь показать вам, как выполнять операции CRUD в React, создав простое веб-приложение для управления пользователями. Мы собираемся использовать пакет Material-table с удаленными данными (т.е. данными из RESTful API). На видео ниже показано приложение, которое мы будем разрабатывать. Пакет Material-table расширяет..
Создание приложения React с помощью Create-React-App и Material-UI
Простое руководство по реализации Material-UI в React Material-UI - это проект с открытым исходным кодом, который реализует компоненты React и который следует принципам дизайна материалов Google. Установка Material-UI в React - довольно простой процесс, но может показаться пугающим для начинающих. Эта статья покажет вам, как создать стартовое приложение Create-React-App , а затем реализовать Material-UI в этом приложении. Примечание. Внизу статьи содержится краткий набор..
Представляем средство отображения компонентов UI-материала для форм, управляемых данными
Одна из самых популярных дизайн-систем Material-UI интегрирована с Data Driven Forms, чтобы сделать создание React-форм максимально быстрым с наименьшим количеством шаблонов. Через Data Driven Forms пользователи mui-component-mapper могут начать использовать компоненты Material React, чтобы писать сложные формы всего за секунды . О формах, управляемых данными Data Driven Forms - это библиотека React с открытым исходным кодом , которая использует управляемый данными подход..