Как отловить в Vue click вне элемента?

Question

[Максим Тимофеев]

Что-то меня переклинило.
Есть компонент, у него есть метод toggleDropdown() он отлично открывает и закрывает мой дропдан. При клике по элементы все понятно, там v-on:click.stop="toggleDropdown" а вот как поступить когда клик слушаться должен любой? Пробую так:

created() {
            document.addEventListener('click', function () {
                this.toggleDropdown();
            });
        },

Но ведь там в this будет не vue и как следствие ошибка. Уверен, что просто решается, но так как я c vue на ты - туплю. Или просто тупой )))

Comments

[Sergei R]

А можете показать свою функцию toggleDropdown()?
Я сделал так

methods: {
  toggleDropdown() {
    this.isActive = !this.isActive
  }
},
created() {
  document.addEventListener('click', () => this.toggleDropdown());
}

У меня открывается и закрывается от любого нажатия в любом месте.
Пробовал так:

methods: {
  openModal() {
    this.isActive = true;
  },
  closeModal() {
    this.isActive = false;
  }
},
created() {
  document.addEventListener('click', () => this.closeModal());
}

Тогда не открывается потому что всегда срабатывает closeModal()

[Ваня Зюзгин]

Sergei R, используйте обработчик событий .stop:
@click.stop="closeModal()"

Answer 1

[Roman K]

document.addEventListener('click', () => this.toggleDropdown());

Или

document.addEventListener('click', this.toggleDropdown.bind(this));

Comments

[Максим Тимофеев]

спс, чувствую себя блондинкой. Начал иначе смотреть на жену.

[Максим Золотой]

Спасибо) это гениально!