[Vue] 확인필요한 사항

<button @click="btnClick3" class="dropdown-btn">Down
  <i id="test123" class="fa fa-caret-down"></i>
</button>
<div class="dropdown-container">
  <a href="#">Link 1</a>
  <a href="#">Link 2</a>
  <a href="#">Link 3</a>
</div>

btnClick3: function(evt) {
  console.log(evt);
  console.log(evt.target);
  console.log(evt.target.nextSibling);
}

<i> 태그의 화살표를 클릭 하면 evt.target.nextSibling 가 null 인 상태

하지만, 그냥 html 파일로 작성했을 경우에는 <div> 태그가 출력된다.

<button @click.capture.stop="">

<i @click=""></i>

</button> 에 주고..

클릭에 대한 이벤트는 발생하기 때문에 클릭에 대한 정의만 없을 뿐이지..

capturing 과 raising 과 bubbling 은 발생한다..

evt.currentTarget.nextSibling해야한다...