[Vuejs]-Vue-js click outside function also works inside of my element- how to fix

by

0đź‘Ť

It doesn’t work because the “plus” or “pencil” icon that is targeted by the event no longer exists by the time you check for el.contains(), because v-if switched that element for another.

Instead, use this so the element stays the same :

<v-btn :class="{ is_active: isActive }" color="red" fab @click="toggleButton" dark x-large>
  <v-icon>{{ isActive ? 'mdi-pencil' : 'mdi-plus' }}</v-icon>
</v-btn>

Leave a comment