需求:为了用户方便进行搜索数据的时候不想点击搜索按钮,想要在input输入框内输入完成之后直接按回车键进行搜索
第一种方法
在input标签内部增加@keyup.enter事件即可,事件名为按钮点击名称
<div class="center">
<input placeholder="输入名称" v-model="keyword"
@keyup.enter="getsearchdata">
</div>
<div class="seal" @click="getsearchdata">搜索</div>
第二种方法
<div class="center">
<input placeholder="输入名称" v-model="keyword"
@keyup.enter.native="getsearchdata" @submit.native.prevent
>
</div>
<div class="seal" @click="getsearchdata">搜索</div>
注:@keyup.enter.native="getsearchdata"//这里要和搜索的事件名称一样
@submit.native.prevent //这句话禁止第一次进入页面回车搜索的时候刷新页面文章来源:https://www.toymoban.com/news/detail-595714.html
以上两种方法,都能实现按回车键进行搜索的功能文章来源地址https://www.toymoban.com/news/detail-595714.html
到了这里,关于Vue按回车键进行搜索的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!