How can i close my modal when i click outside of my modal?

Question

I am trying to use this library https://www.npmjs.com/package/click-outside-vue3 for close when i will click outside of the modal?

i made this code:

<div
    v-if="dialogFoundation"
    v-click-outside="close"
  >

 import vClickOutside from 'click-outside-vue3'
 directives: {
  clickOutside: vClickOutside.directive
},
setup() {

  const close = () => {
        console.log(4343)
  }
}

but its not working, i want to close the modal

also i setup the main.js

import vClickOutside from "click-outside-vue3"
...
createApp(App)
  .use(vClickOutside)

I did have work around this, check this one [Detect click outside element](https://stackoverflow.com/questions/36170425/detect-click-outside-element) — Naren, Apr 11 '22 at 22:04

score 1 · Accepted Answer · answered Apr 11 '22 at 22:38

1

have you set the directive as it's found in the documentation ?

directives: {
      clickOutside: vClickOutside.directive
    },

```

answered Apr 11 '22 at 22:38

Wax

110
6

yep, also i did that – signup Apr 11 '22 at 22:53

How can i close my modal when i click outside of my modal?

1 Answers1