javascript - vue中input的blur影响了下拉的点击事件如何解决

问题描述

<input type='search' autocomplete='off' name='search' value='' @focus='inFocus()' @blur='inBlur()' v-model='val' @keydown.enter='search()'><ul v-show='headerStatus'> <li v-for='item in results'><p> <span @click='searchClick($event)'>{{item.name}}</span> <span class='item-num'>约有{{item.number}}件</span></p> </li></ul>我原意是点击这个input后，有一个下拉菜单，点击下拉菜单触发searchClick进行搜索，但是点击下拉菜单后，input的blur就触发了，下拉菜单消失，无法触发点击事件，应该如何解决，前提要点击空白处会消失下拉。

问题解答

在searchClick($event)中加一个$event.preventDefault();