This is rendered in Modal, now the problem is when i close the modal and open another, there's 2 instance one running in display and the previous one that is running in background waiting to finish typing.
<Typewriter
options={{delay: 50, loop: false}}
onInit={typewriter => {
typewriter
.typeString(newMessage)
.pauseFor(1000)
.callFunction(() => {
// this is called when newMessage completes typing
if (trackId) {
setShow(true);
}
})
.start();
}}
/>
what i want to do is call a stop or restart of event so it won't reach the callFunction on the previous one that is running in background.
once handleCloseModal is called it should restart and only one Typewriter should start
This is rendered in Modal, now the problem is when i close the modal and open another, there's 2 instance one running in display and the previous one that is running in background waiting to finish typing.
what i want to do is call a stop or restart of event so it won't reach the callFunction on the previous one that is running in background.
once handleCloseModal is called it should restart and only one Typewriter should start
is this possible? and how can i achieve this using react?