/
ashipov
/
react
Обзор
Документация
Войти
/
ashipov
/
react
Код
Запросы
0
Задачи 2.0
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
main
packages/react-devtools-shell/src/app/Iframe/index.js
71 строка
1 KB
Jan Kassens
Upgrade prettier (#26081)
31 янв 2023, 16:25
Не верифицирован
31 янв 2023, 16:25
6b30832
Код
Авторство
О чём код?
/** @flow */ import * as React from 'react'; import {Fragment} from 'react'; import {createPortal} from 'react-dom'; export default function Iframe(): React.Node { return ( <Fragment> <h2>Iframe</h2> <div> <Frame> <Greeting /> </Frame> </div> </Fragment> ); } const iframeStyle = {border: '2px solid #eee', height: 80}; // $FlowFixMe[missing-local-annot] function Frame(props) { const [element, setElement] = React.useState(null); const ref = React.useRef(); React.useLayoutEffect(function () { const iframe = ref.current; if (iframe) { const html = ` <!DOCTYPE html> <html> <body> <div id="root"></div> </body> </html> `; const document = iframe.contentDocument; document.open(); document.write(html); document.close(); setElement(document.getElementById('root')); } }, []); return ( <Fragment> <iframe title="Test Iframe" ref={ref} style={iframeStyle} /> <iframe title="Secured Iframe" src="https://example.com" style={iframeStyle} /> {element ? createPortal(props.children, element) : null} </Fragment> ); } function Greeting() { return ( <p> Hello from within an <code><iframe></code>! </p> ); }