/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/material/components/portal/SimplePortal.js
29 строк
804 B
Sam Sycamore
[docs] Restore utility component docs from MUI Base to Material UI (#45213)
07 фев 2025, 18:47
Не верифицирован
07 фев 2025, 18:47
a6e959d
Код
Авторство
О чём код?
import * as React from 'react'; import Portal from '@mui/material/Portal'; import { Box } from '@mui/system'; export default function SimplePortal() { const [show, setShow] = React.useState(false); const container = React.useRef(null); const handleClick = () => { setShow(!show); }; return ( <div> <button type="button" onClick={handleClick}> {show ? 'Unmount children' : 'Mount children'} </button> <Box sx={{ p: 1, my: 1, border: '1px solid' }}> It looks like I will render here. {show ? ( <Portal container={() => container.current}> <span>But I actually render here!</span> </Portal> ) : null} </Box> <Box sx={{ p: 1, my: 1, border: '1px solid' }} ref={container} /> </div> ); }