el-input框绑定键盘回车搜索事件 加上@keyup.enter.native="search"
<el-input v-model="key" placeholder="请输入">
<template #append>
<el-button :icon="Search" @click="getdatalist" @keyup.enter.native="search"/>
</template>
</el-input>然后
<script setup lang="ts">
// 搜素键盘回车事件
const search=(e:any)=>{
if(e.keyCode==13){
getdatalist()
}
}
// 开启键盘监听事件
window.addEventListener('keydown', search, true)
</script>
第二种方法：作用在input元素身上
在html中文章来源：https://www.toymoban.com/news/detail-765905.html
<div class="topSearch">
<el-input v-model="key" placeholder="请输入" @keyup.enter="search">
<template #append>
<el-button :icon="Search" @click="getdatalist" />
</template>
</el-input>
</div>然后文章来源地址https://www.toymoban.com/news/detail-765905.html
<script setup lang="ts">
//搜索框
const key = ref('')
// 搜素键盘回车事件
const search=(e:any)=>{
if(e.keyCode==13){
getdatalist()
}
}
//获取HS编码数据列表
const getdatalist=()=>{
getHSCodelist(page.value,pageSize.value,key.value).then(res=>{
tableData.value=res.data.Items
total.value=res.data.Total
})
}
</script>到了这里，关于vue3和ts的el-input的键盘回车绑定事件的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
