/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/material/components/checkboxes/IndeterminateCheckbox.tsx
49 строк
1 KB
Siriwat K
[docs] Migrate content to the new location (#30757)
04 фев 2022, 07:13
Не верифицирован
04 фев 2022, 07:13
27f1c28
Код
Авторство
О чём код?
import * as React from 'react'; import Box from '@mui/material/Box'; import Checkbox from '@mui/material/Checkbox'; import FormControlLabel from '@mui/material/FormControlLabel'; export default function IndeterminateCheckbox() { const [checked, setChecked] = React.useState([true, false]); const handleChange1 = (event: React.ChangeEvent<HTMLInputElement>) => { setChecked([event.target.checked, event.target.checked]); }; const handleChange2 = (event: React.ChangeEvent<HTMLInputElement>) => { setChecked([event.target.checked, checked[1]]); }; const handleChange3 = (event: React.ChangeEvent<HTMLInputElement>) => { setChecked([checked[0], event.target.checked]); }; const children = ( <Box sx={{ display: 'flex', flexDirection: 'column', ml: 3 }}> <FormControlLabel label="Child 1" control={<Checkbox checked={checked[0]} onChange={handleChange2} />} /> <FormControlLabel label="Child 2" control={<Checkbox checked={checked[1]} onChange={handleChange3} />} /> </Box> ); return ( <div> <FormControlLabel label="Parent" control={ <Checkbox checked={checked[0] && checked[1]} indeterminate={checked[0] !== checked[1]} onChange={handleChange1} /> } /> {children} </div> ); }