Vue.js watch DOM element property outside components / app

Question

I have a vue component nested in a regular website.

I would like to watch from the component if a DOM element is clicked outside of this component. this is just a regular HTML element NOT in a vue component

I can't use v-on. I also tried a regular event listener but that does not work either because it cannot access the component's property...

Is there a way to do this ?

Answer 1

Simply add an event listener in mounted() of your component. Here's a fiddle I put together: https://jsfiddle.net/2kwjvtun/