将 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>
网友评论