Вопросы с меткой [material-ui]

Руководство по использованию метки отсутствует.

Фильтрация
Сортировка
Метки
0 голосов
0 ответов
8 показов

Как сделать скролл вертикальный в TextField material ui?

Как сделать скролл вертикальный в TextField material ui? Хочу добавить скролл вертикальный в TextField, видела решение, что можно заменить его на select, и через menuProps, добавить, но данное решение ...
0 голосов
1 ответ
12 показов

Функция map не срабаотывает если её в TextField сделать в отдельном файле material-ui

Есть два переключателя, первый переключатель работает корректно, второй переключатель не срабатывает. Разница только в том, что во втором переключатели я вынесла функцию map в отдельный файл. Можно ли ...
0 голосов
1 ответ
15 показов

React JS Mui ui Проблемма с передачей значения в Autocomplete

<Autocomplete multiple id="tags-standard" options={labels2} getOptionLabel={(option) => option.marketplaceType} value={labels} onChange={...
0 голосов
0 ответов
15 показов

Как настроить ссылку на styled компонент TableRow в material ui

У меня есть styled компонент TableRow из mui const StyledTableRow = styled(TableRow)(({ theme }) => ({ color: theme.palette.text.secondary, '&:hover': { background: theme.palette.action....
1 голос
1 ответ
53 показа

Модальное/диалоговое окно всплывающее из кнопки/элемента

Есть задача, где необходимо показать модальное окно, будто всплывающее из кнопки (в конечном результате отображается, по центру экрана), есть ли какие-то готовые реализации данного функционала в MUI ...
1 голос
1 ответ
32 показа

Перенос строки MaterialUi

Как убрать перенос слова на вторую строку? <Box> <Box> <Box> <Typography theme={theme} variant='h8' border="1px black" colors="tehs.main" maxWidth="200px&...
  • 23
0 голосов
0 ответов
19 показов

Почему не меняется цвет текста MaterialUI

Почему цвет текста не меняется? Создал цветовую тему: const theme = createTheme({ palette: { botam: { main: '#9D9D9D' }, tehs: { main: '#FFFF' } }});...
  • 23
0 голосов
0 ответов
15 показов

Как добавить свою иконку MaterialUi?

Как добавить свою иконку MaterialUi? Пробовал следующим образом: // webpack.config.js { test: /\.svg$/, use: ['@svgr/webpack'], } // --- import StarIcon from './star.svg'; <SvgIcon component={...
  • 23
0 голосов
0 ответов
8 показов

Куда добавлять параметры Webpack?

Хочу добавить свою иконку через MaterialUi следующим образом: // webpack.config.js { test: /\.svg$/, use: ['@svgr/webpack'], } // --- import StarIcon from './star.svg'; <SvgIcon component={...
  • 23
0 голосов
0 ответов
11 показов

Как импортировать makeStyles в material UI?

Пытаюсь подключить следующим образом: import { makeStyles } from '@material-ui/core/styles'; Выдаёт ошибку: Compiled with problems:X ERROR in ./src/App.jsx 10:0-54 Module not found: Error: Can't ...
  • 23
0 голосов
0 ответов
14 показов

Как называется данная иконка?

Вот эта иконка с кругом и с фоном, а как называется просто иконка телеграмма без фона? <i class="material-icons">telegram</i> На официальном сайте material design найти не могу. ...
  • 5
0 голосов
0 ответов
22 показа

Range slider Material UI. Работа с массивом значений

Имеется массив: const data = [0, 1, 3, 4, 6, 7, 9, 10, 12, 13, 15, 16, 18, 19, 21, 24]; определяется стейт с начальным значением в компоненте: const [value, setValue] = useState<number[]>(data);...
0 голосов
0 ответов
30 показов

AlertDialog (с картой) открывается со второго раза

Сам код public class testcl extends AppCompatActivity implements com.huawei.hms.maps.OnMapReadyCallback { protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); ...
0 голосов
0 ответов
25 показов

Как совместить Material-UI и CSS-препроцессор?

(Я джун без опыта и делаю свое первое тестовое) В задании нужно в проекте использовать и Material-UI, и CSS-препроцессор. Меня это очень запутало, т.к. опыта с MUI нет вообще. Какой смысл в совмещении ...
0 голосов
0 ответов
18 показов

Улучшение читабельности кода через cx, сlsx или className

Имеется функция, которая возвращает объект специально для cx. Объект такого типа { border: '1px solid red' } (определение свойства специально в кавычках для cx). Элемент, который стилизуется выглядит ...
1 голос
0 ответов
15 показов

Упрощение стилей

Имеются элементы такого вида: <Typography className={styles.element} sx={{ color: `${getColor(status)}` }}> {state} </Typography> Возможно ли упростить данную ...
0 голосов
1 ответ
11 показов

После установки defaultMode в mui, все установленные вручную стили были сброшены, как их вернуть?

Я использую в одном проекте как компоненты из mui/material, так и из mui/joy. Попыталась установить Темную тему, именно для компонент из mui/joy (установка темы в mui/joy немного отличается от ...
0 голосов
1 ответ
58 показов

Как изменить стиль в mui checkbox на противоположный?

Есть простой компонент Checkbox с атрибутом color="primary" по умолчанию, этот атрибут добавляет цвет к фону флажка, а сам флажок прозрачный, как можно сделать наоборот? Вот пример как есть: ...
  • 5
0 голосов
1 ответ
82 показа

Как расширить интерфейс у компонента Autocomplete MUI v5

Подскажите пожалуйста, как расширить интерфейс у компонента Autocomplete MUI v5? TS ругается, а как поправить не знаю(( Generic type 'AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ...
  • 199
0 голосов
0 ответов
20 показов

Можно ли конвертировать объект sx в обычный для style

Я хочу получить из объекта: const sx = { display: "flex" } объект подобный: const sx = { display: "-webkit-box", display: "-webkit-flex", display: "...
0 голосов
0 ответов
39 показов

MUI: A component is changing the default value state of an uncontrolled Rating after being initialized

В чем проблема, почему возникает такая ошибка: MUI: A component is changing the default value state of an uncontrolled Rating after being initialized. To suppress this warning opt to use a controlled ...
0 голосов
1 ответ
43 показа

Возникает ошибка из-за атрибута "component" в стилизованном элементе MUI / React

Я пытаюсь создать стилизованный Button элемент из MUI, но у меня возникает проблема. Код компонента: import { Button, styled } from '@mui/material'; const ButtonBase = styled(Button)( { ...
0 голосов
0 ответов
17 показов

React MUI: FormGroup управление состоянием группы Checkbox

Имею следующую структуру return ( <Box> <FormControlLabel labelPlacement='end' control={<Checkbox size='small' indeterminate={indeterminate}/>} label="Select ...
  • 511
0 голосов
1 ответ
52 показа

Как зарегистрировать radio button(material-ui) в React Hook Form

Весь вопрос в описании. Если с текстовым input всё просто ({...register("name")}), то как это сделать с radio button понять не могу. Есть предположение, что нужно использовать useState и ...
0 голосов
0 ответов
17 показов

Reusable table component

Есть некий reusble table component, но не могу понять какие данные туда нужно передать, можете отправить варианты? import { useState } from 'react' import { Checkbox, styled } from '@mui/material' ...
0 голосов
0 ответов
6 показов

Material UI: Как переопределить брейкпойнты в пикселях для использования в Grid?

В компоненте Grid можно использовать брейкпойнты, как например здесь: <Grid item xs={12} lg={6}> ... </Grid> По умолчанию эти брейкопойнты равняются: xs, extra-small: 0px sm, small: ...
0 голосов
0 ответов
59 показов

popover react MUI, как сделать под div

в библиотеке MUI под реакт есть компонент popover, мое тз заключается в том чтобы сделать календарь, и мне надо по нажатию на день недели всплывающее окно, и туда уже вносить данные такие как имя, ...
  • 1
2 голоса
1 ответ
70 показов

Как поменять цвет обводки у элемента MuiOutlinedInput

Есть элемент типа input, хочу изменить у него обводку при наведение, но она не меняется можете подсказать её изменить? цвет при hover MuiOutlinedInput: { styleOverrides: { root: { ...
2 голоса
1 ответ
327 показов

Как изменить цвет текста у Tabs? material ui

Хочу отредактировать начальный цвет текста и цвет текста который активный пытаюсь сделать, через эту переменную, но не получается contrastText: "#7f1616" , как можно отредактировать ...
1 голос
0 ответов
83 показа

Как в Material Ui кастомизировать всплывающее меню Select?

Как в Material Ui кастомизировать стиль всплывающего меню компонента Select? Судя по доке, у него даже нет специального атрибута, в который можно было бы вставить свой Menu или Popper. Решение ...
1 голос
0 ответов
240 показов

Аналог mui material UI, в React 18

Прочитала в документации material, что подход к созданию пользовательских стилей устарел в React 18 и получается, что он не работает. Как можно с помощью material UI создавать пользовательские стили в ...
0 голосов
0 ответов
137 показов

Кастомизация стилей Mui Select

Как стилизовать выпадающий список меню Select? И второй вопрос, как убрать черную обводку при наведении (hover)?
0 голосов
0 ответов
158 показов

Как в Mui Select сделать свою стрелку?

Я пытаюсь сделать кастомную стрелку для Mui Select. Для этого я использую проп IconComponent, но у меня получилось только передать в него изображение. Как сделать, чтобы оно менялось при клике? ...
0 голосов
1 ответ
141 показ

Как прокинуть React props в mui select с кастомной стилизацией?

Я использую React и Mui Select, который имеет кастомные стили. Я не понимаю, как мне перекинуть пропсы в эти стили. В этом примере я прокидываю в компонент MuiSelect параметр height, который по ...
0 голосов
0 ответов
56 показов

Make Styles MUI

Всем доброго времени суток, пытаюсь разобраться почему у меня пропадают все элементы после добавления MakeStyles Помогите выяснить что я делаю не так. import { Button, AppBar, Box, Container, ...
0 голосов
1 ответ
65 показов

Material ui: Как динамически менять свойства массива иконок?

Есть большой массив иконок, условно: const ICONS_ARRAY: React.ReactNode[] = [ <AlertCircleCheckOutline />, <AppleSafari />, <MotionPlay />, <AppleKeyboardCommand />, <...
  • 96
0 голосов
1 ответ
24 показа

как можно решить данную проблему?

import logo from './logo.svg'; import './App.css'; import Button from '@mui/material/Button'; import Box from '@mui/material/Box'; import Container from '@mui/material/Container'; import { styled } ...
0 голосов
1 ответ
197 показов

Material-ui. Не применяются стили к <Box>

Всем привет. Начал изучать React. Также использую material-ui. Но столкнулся с такой проблемой: при кастомизации компонента Box не применяются указанные стили. Буду очень благодарен за любую наводку. ...
0 голосов
0 ответов
40 показов

Refetch и Rerender компонента

Приветствую знатоков ReactJS! Написал вот такой компонент, по сути это модальное окно: function ProviderCommentsDialog({ process }) { const steps = process.Steps.filter(step => step....
  • 27
-1 голос
1 ответ
170 показов

Визуальный баг с <TextField> material-ui

Столкнулся с довольно странным визуальным багом. Думаю, лучше взглянуть на видео: https://youtu.be/P9mQo5WC-Os В чём проблема? При фокусе у поля есть анимация: placeholder становится меньше и ...
  • 1,154
0 голосов
0 ответов
56 показов

Как в Material UI задать резиновую высоту таблицы?

В документации Material UI есть прекрасный пример как сделать эффект stickyHeader для таблицы: GitHub. Но в качестве максимальной высоты таблицы там используется hardcode: <TableContainer sx={{ ...
0 голосов
0 ответов
50 показов

Как правильно кастомизировать тему в material ui 5

Пытаюсь кастомизировать тему в последнем material ui, использую вместе с typescrypt, при использовании в компненте в пропсе color цвет меняется но выпадает ошибка: "No overload matches this call. ...
0 голосов
1 ответ
61 показ

Как поменять синий цвет и (интервал минуты 15m) в input time и д

<input type = 'time'/ > .
0 голосов
1 ответ
244 показа

Сброс дефолтных стилей компонента Material UI (v.4)

Всем привет. Подскажите, как можно сбросить стили у компонента (в моем примере это Link), например, через makeStyles? Чтобы у ссылки были дефолтные браузерные стили, а не материаловские.
  • 15
0 голосов
1 ответ
35 показов

Одна разметка для разных экранов

У сайта есть несколько брейкпоинтов (1280, 760 и т.д.). На hd устройствах, все работает, как ожидается. Но на других, у которых макс ширина, например 1024, сайт показывается, как для ширины 760+. Как ...
  • 161
2 голоса
1 ответ
887 показов

(React / Firebase) Как выводить данные из БД?

Имеется база данных, а также сетка, в элементах которых надо вывести название и описание статьи, но пока здесь только лишь один элемент (картинки не трогаем). Данные в БД: Код сетки: import * as ...
  • 168
1 голос
1 ответ
302 показа

(Material UI) Проблема подключения картинки

Имеется ссылка, которая возвращает случайное изображение (https://picsum.photos/600/300), а также код элемента сетки. Как мне сделать так, чтобы каждый элемент имел разные изображения? Не имею ...
  • 168
0 голосов
0 ответов
116 показов

To address all issues (including breaking changes), run: npm audit fix --force

Пытаюсь установить material ui. Версия реакта 17.0.2 выдает ошибку added 43 packages, and audited 2033 packages in 17s 10 moderate severity vulnerabilities To address all issues (including breaking ...
  • 289
0 голосов
1 ответ
135 показов

Управление textfield через 2 независимых selectora (Material UI)

У меня есть компонент в котором будет использоваться два Select и TextField из Material Ui. Как можно сделать так, чтобы если пользователь выбрал в селект 1 ответ А и селект 2 ответ Б, в TextField ...
  • 35
0 голосов
1 ответ
110 показов

Как можно добавить лейбл у кнопки по аналогии с селектом (Material ui) [закрыт]

Всем привет. Используется библиотека Material UI Как можно добавить для кнопки лейбл. Возможно есть какие-то костыли?
  • 35