Modal State
Getting Started
You can use this react hook to control your modal more easily. It provides a better code representation of modal state, which is useful when you are managing multiple modals. Also you can attach callbacks for every action of modal, like opening and closing of modal.
Installation
To install and set up the library, run:
npm install -S modal-stateOr if you prefer using Yarn:
yarn add --dev modal-stateHow to use
const Component = () => {
const modal = useModal();
return (
<body>
<button onClick={modal.open}>Open modal</button>
<Modal isOpen={modal.isOpen} onClose={modal.close}></Modal>
</body>
);
};Attach callbacks
const modal = useModal({
onClose: () => {
//gets executed when modal is closed
},
onOpen: () => {
//gets executed when modal is opened
},
});