在看完照片之后。它怎么能关闭？
提问于 2022-10-08 07:57:09
我想要能够点击视图按钮，然后它扩大图片，然后我想能够点击页面和图片回到它的正常大小。
import * as React from 'react';
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import Typography from '@mui/material/Typography';
import Modal from '@mui/material/Modal';
import { CardMedia } from '@mui/material';
export default function BasicModal() {
const [open, setOpen] = React.useState(false);
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<div>
<Button onClick={handleOpen}>View</Button>
<Modal
open={open}
onClose={handleClose}
>
<CardMedia
sx={{paddingTop: '100%'}}
image="https://lorempokemon.fakerapi.it/pokemon"
title="Image title"
/>
</Modal>
</div>
);
}
回答 1
Stack Overflow用户
发布于 2022-10-08 08:35:41
我认为尝试使用useEffect。这是w3schools的一个例子。这是相关的页面：https://www.w3schools.com/react/react_useeffect.asp，它适用于我类似的问题。
useEffect(() => {
//Runs on the first render
//And any time any dependency value changes
}, [open]);它应该在每次更改open变量时再次呈现。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73998465
复制相关文章
腾讯云开发者
