click事件如何让其点击的是该元素而并非子元素？

Question

<li>
    <a href="#" @click.self="longPress($event)">
        <img :src="$store.state.lazyload" data-src="/topic/green.png" onload="lzld(this)">
    </a>
</li>

longPress: function (e) {
    console.log(e.target.tagName); // IMG
}

.list li{
    width: (139rem/$num);
    height: (160rem/$num);
    border-radius: (5rem/$num);
    display: inline-block;
    text-align: center;
    font-size: (20rem/$num);
  }
  .list li a{
    color: #787878;
    display: block;
  }
  .list li img{
    width: (100rem/$num);
    height: (100rem/$num);
    margin: 0 auto (10rem/$num);
  }

如何让longpress事件点击到的是a？

Answer 1

如果保證是父子關係的話，直接取得 parentNode 就可以了：

longPress: function (e) {
    console.log(e.target.parentNode);
}

Answer 2

如果是vue2.0的话,可以尝试添加.native修饰符