elementUI: el-input 回车提交，阻止默认事件

将 el-input 放入 el-form 中之后，el-input 回车会导致页面刷新. 解决办法
el-form 添加 @submit.native.prevent 阻止提交事件。
el-input 添加 @keyup.enter.native 事件回车提交。

<template>
    <div>
        <el-form :model="form" @submit.native.prevent>
            <el-input type="text" v-model="form.query" @keyup.enter.native="handleQuery" />
            <el-button type="primary" @click="handleQuery">提交</el-button>
        </el-form>
    </div>
</template>
<script>
export default {
    data() {
        return {
            form: {
                query: ''
            }
        };
    },
    methods: {
        handleQuery() {
            // axios ... and so on.
        }
    }
};
</script>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容