import {useState} from "react"; import {Modal} from "../Modal/Modal"; export interface DetailsButtonProps { text: string } export const DetailsButton = ({text}: DetailsButtonProps) =>

Вопрос пользователя:

import {useState} from "react"; import {Modal} from "../Modal/Modal"; export interface DetailsButtonProps { text: string } export const DetailsButton = ({text}: DetailsButtonProps) => { const [showModal, setShowModal] = useState<boolean>(false); const toggleModal = () => { setShowModal(!showModal); }; return ( <> <button onClick={toggleModal}>Подробнее</button> {showModal && <Modal onClose={() => setShowModal(false)} text={text}/>} </> ); } исправить с учетом Вам необходимо, используя createPortal в компоненте DetailsButton , сделать так, чтобы компонент окна Modal при нажатии на кнопку Подробнее добавлялся в div c атрибутом id='react-id'.

Ответ нейросети:

Пройдите быструю авторизацию для просмотра:

import {useState} from "react"; import {createPortal} from "react-dom"; import {Modal} from "../Modal/Modal";

export interface DetailsButtonProps { text: string }

export const DetailsButton = ({text}: DetailsButtonProps) => { const [showModal, setShowModal] = useState<boolean>(false); const toggleModal = () => { setShowModal(!showModal); };

return (
    <>
        <button onClick={toggleModal}>Подробнее</button>
        {showModal && createPortal(<Modal onClose={() => setShowModal(false)} text={text}/>, document.getElementById('react-id'))}
    </>
);

}

Напишите нам, если в вопросе есть ваши персональные данные (yasnoponyatno24@yandex.ru)

ЯсноПонятно24

Пройдите быструю авторизацию для просмотра:

Пройдите быструю авторизацию для просмотра:

Последние вопросы: