Чтобы установить Material-UI Lab, вы можете выполнить следующие действия:
Метод 1: использование npm
- Откройте терминал или командную строку.
- Перейдите в каталог вашего проекта.
- Выполните следующую команду, чтобы установить Material-UI Lab:
npm install @mui/lab
Метод 2: использование пряжи
- Откройте терминал или командную строку.
- Перейдите в каталог вашего проекта.
- Выполните следующую команду, чтобы установить Material-UI Lab:
yarn add @mui/lab
После установки Material-UI Lab вы можете импортировать и использовать его компоненты в своем коде.
Вот пример использования компонента ToggleButtonиз Material-UI Lab:
import React from 'react';
import { ToggleButtonGroup, ToggleButton } from '@mui/lab';
const MyComponent = () => {
const [alignment, setAlignment] = React.useState('left');
const handleAlignment = (event, newAlignment) => {
if (newAlignment !== null) {
setAlignment(newAlignment);
}
};
return (
<ToggleButtonGroup
value={alignment}
exclusive
onChange={handleAlignment}
aria-label="text alignment"
>
<ToggleButton value="left" aria-label="left aligned">
Left
</ToggleButton>
<ToggleButton value="center" aria-label="centered">
Center
</ToggleButton>
<ToggleButton value="right" aria-label="right aligned">
Right
</ToggleButton>
<ToggleButton value="justify" aria-label="justified" disabled>
Justify
</ToggleButton>
</ToggleButtonGroup>
);
};
export default MyComponent;
В этом примере показано использование компонентов ToggleButtonGroupи ToggleButtonиз Material-UI Lab для создания группы кнопок-переключателей с различными параметрами выравнивания.