Цель события Vue.js равна нулю? - PullRequest
Новая
       8

Цель события Vue.js равна нулю?

0 голосов
/ 26 апреля 2018

Я получил компонент с двумя стилизованными кнопками и одним и тем же событием "MouseEnter". 

<template>
  <div>
      <a 
          class="button red" 
          href="/about" 
          @mouseover="mouseEnter">  
          <svg viewBox="0 0 180 60">
              <path d="..."/>
          </svg>
          <span class="buttonSpan">About</span> 
      </a>
      <a 
          class="button green" 
          href="/contact" 
          @mouseover="mouseEnter">  
          <svg viewBox="0 0 180 60">
              <path d="..."/>
          </svg>
          <span class="buttonSpan">Contact</span>   
      </a>
  </div
</template>

Когда событие срабатывает, я хочу что-то сделать с path и span кнопки, которая находится наверху.

Я пытаюсь сослаться на них с помощью event.target , но для промежутка я получаю нулевое значение, а для пути все работает хорошо. 

methods: {
  buttonEnter(event) {
    const buttonPath = event.target.querySelector('path')
    const buttonSpan = event.target.querySelector('span')
    
    ...
}

Как мне ссылаться на промежуток? Есть ли другой способ, которым я могу это сделать?

1 Ответ

0 голосов
/ 26 апреля 2018

цель события будет всплывать, начиная с дочерних узлов узла, к которому вы подключили слушателя. Используйте event.currentTarget

...