我想在 antd 中打開影像的預覽而不單擊影像縮略圖本身（例如通過單擊按鈕）：
import React from 'react';
import {Image, Button} from 'antd';
const Foo: React.Fc<any> = (props) => {
const [isPreviewVisible,setPreviewVisible] = useState<boolean>(false);
return (
<div>
<Image
// something like this
// isPreviewVisible={isPreviewVisible}
src="some url"
/>
<Button onClick={()=>setState(!isPreviewVisible)}>Click me!</Button>
</div>
);
};
我想實作它類似于上面的代碼，但找不到任何方法來做到這一點。
編輯：我想用狀態控制/切換預覽的可見性。
uj5u.com熱心網友回復：
你可以這樣做：
function ImageDemo() {
const [isPreviewVisible, setPreviewVisible] = useState(false);
return (
<>
<Image
width={200}
preview={{
visible: isPreviewVisible,
onVisibleChange: (visible, prevVisible) => setPreviewVisible(visible),
}}
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
/>
<Button onClick={() => setPreviewVisible(!isPreviewVisible)}>
Click me
</Button>
</>
);
}
我還在這里實作了一個示例，您可以查看：
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/383526.html
標籤：javascript 反应 打字稿 蚂蚁