【Vue3+Element Plus】（单 input）el-form 阻止（回车）提交时刷新页面

最新推荐文章于 2024-07-10 11:02:18 发布

老咸鱼催吐

最新推荐文章于 2024-07-10 11:02:18 发布

阅读量929

点赞数 7

分类专栏：问题解决记录前端文章标签： vue.js 前端 ui

本文链接：https://blog.csdn.net/Felix61Felix/article/details/134840175

版权

问题解决记录同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

前端

10 篇文章 0 订阅

订阅专栏

本文介绍了如何在Vue.js的模板中使用el-form组件进行搜索，重点讲解了`@submit.prevent`修饰符阻止表单默认提交行为和`v-model`绑定输入框的值。展示了如何结合使用这两个特性实现搜索功能。

摘要由CSDN通过智能技术生成

关键代码 @submit.prevent：

<template>
    <el-form @submit.prevent="handleSearch">
        <el-input v-model="searchKeyword" size="large" clearable>
            <template #append>
                <el-button :icon="Search" @click="handleSearch" />
            </template>
        </el-input>
    </el-form>
</template>