使用elementUI的el-form組件進行查詢時,當輸入框僅有一項時,回車自動提交表單,瀏覽器會刷新頁面:
原因:由於當表單只有一個文本框時,按下回車將會觸發表單的提交事件, 從而導致頁面刷新。
1 <el-form :inline="true" :model="getForm" class="demo-form-inline">
2 <el-form-item label="科目名稱">
3 <el-input v-model.trim="getForm.exam_name" @keyup.enter.native="search"
></el-input>
4 </el-form-item>
5 </el-form>
解決方案:在 el-from 加上 @submit.native.prevent
1 <el-form :inline="true" :model="getForm" class="demo-form-inline" @submit.native.prevent>
2 <el-form-item label="科目名稱">
3 <el-input v-model.trim="getForm.exam_name" @keyup.enter.native="search"
></el-input>
4 </el-form-item>
5</el-form>