关于ElementUI 中 input 上加@keyup.enter.native事件会出现刷新整个页面的问题

 

<el-form inline size="small" label-position="100px">

          <el-form-item label="关键字">

                  <el-input

                        v-model="queryParams.key"

                        clearable

                         @keyup.enter.native="queryData()"

                  ></el-input>

            </el-form-item>

            <el-form-item>

                 <el-button

                         size="small"

                         icon="el-icon-search"

                         type="primary"

                         @click="queryData()"

                   >

                            查询

                   </el-button>

              </el-form-item>

</el-form>

给input框加上@keyup.enter.native事件后点击enter不会执行queryData方法，反而刷新了整个页面，百度发现：

form 表单中只有一个输入框，在输入框中按下回车就是提交该表单，且会刷新页面。阻止这一默认行为，可以 在 form 标签上添加 @submit.native.prevent。

<el-form inline size="small" label-position="100px" @submit.native.prevent>