Jenesius/vue-modal

prevent close when click outside

Closed this issue · 5 comments

morteza-mortezai commented

Hello,

I want to know if there is any way to prevent modal close when click modal outside .

I know I can prevent it like below but it is not good for me because I want to close it with emmited event and this can't do that

  modal.onclose = () => {
    return false;
  }

is there any way ?

Jenesius commented

@morteza-mortezai Hi.
If it needed right now, u can use config:

import {config} from "jenesius-vue-modal";

config({
    backgroundClose: false
})

But it will added to all modals.
Or, give me one day, i will add it the same functional just for one modal in library

  • 👍1
  • ❤️1
Jenesius commented

Also, if u will use config without adding to all modals backgroundClose key, u can try it :

mounted() {
  config({
    backgroundClose: false
})
},
unmounted() {
  config({
      backgroundClose: true
  })
}

but this is a quick fix - not pretty and doesn't respect modal logic

Jenesius commented

I will add the third parameter to openModal and pushModal

 openModal(Modal, {}, { backgroundClose: Boolean })
Jenesius commented

@morteza-mortezai
Version 1.5.1

 openModal(Modal, {}, { backgroundClose: false })

or

const modal = await openModal(Modal);
modal.backgroundClose = false;
  • 👍1
Jenesius commented

In future i will add event to onClose/beforeModalClose/onBeforeModalClose hooks:

modal.onclose = (e: ModalEvent) {
  if (e.background) return false; // Stop closing modal, if user click on background
}

I will create the task for it.
Thnx you for making this library better!

  • 👍1