vue中input的blur影响下拉框中点击事件
<input class="search-ipt" type="search" autocomplete="off" name="search" value="" @focus="inFocus()" @blur="inBlur()" v-model="val" @keydown.enter="search()"><ul class="search-result clearf..
·
<input class="search-ipt" type="search" autocomplete="off" name="search" value="" @focus="inFocus()" @blur="inBlur()" v-model="val" @keydown.enter="search()">
<ul class="search-result clearfix" v-show="headerStatus">
<li v-for="item in results">
<span class="item-name" @click="searchClick($event)">{{item.name}}</span>
<span class="item-num">约有{{item.number}}件</span>
</li>
</ul>
选择下拉框中的数据后,选中的值不会在input中展示。主要的原因是blur的优先级比click高,blur后清空数组,click将无法执行。
解决办法一:blur执行的函数可以加个定时器,在100ms后执行
解决办法二:将click换成优先级更高的mousedown,将优先于blur执行
更多推荐
已为社区贡献13条内容
所有评论(0)