48 lines
1.0 KiB
React
48 lines
1.0 KiB
React
|
import {useCallback, useMemo, useState} from 'react';
|
||
|
|
import * as React from 'react';
|
||
|
|
import {Modal} from "antd";
|
||
|
|
|
||
|
|
export default function useModal(){
|
||
|
|
const [modalContent, setModalContent] = useState(null);
|
||
|
|
const [isOpen,setIsOpen]=useState(true)
|
||
|
|
const onClose = useCallback(() => {
|
||
|
|
setModalContent(null);
|
||
|
|
setIsOpen(false)
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
const modal = useMemo(() => {
|
||
|
|
if (modalContent === null) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
const {title, content, closeOnClickOutside} = modalContent;
|
||
|
|
return (<div>
|
||
|
|
<Modal
|
||
|
|
open={isOpen}
|
||
|
|
//onOk={handleOk}
|
||
|
|
onCancel={onClose}
|
||
|
|
title={title}
|
||
|
|
// closeOnClickOutside={closeOnClickOutside}
|
||
|
|
>
|
||
|
|
|
||
|
|
{content}
|
||
|
|
</Modal></div>
|
||
|
|
);
|
||
|
|
}, [modalContent, onClose,isOpen]);
|
||
|
|
|
||
|
|
const showModal = useCallback((
|
||
|
|
title,
|
||
|
|
getContent,
|
||
|
|
closeOnClickOutside = false,
|
||
|
|
) => {
|
||
|
|
setModalContent({
|
||
|
|
closeOnClickOutside,
|
||
|
|
content: getContent(onClose),
|
||
|
|
title,
|
||
|
|
});
|
||
|
|
},
|
||
|
|
[onClose],
|
||
|
|
);
|
||
|
|
|
||
|
|
return [modal, showModal];
|
||
|
|
}
|