问题描述

封装了一个组件，在form表单里有一个即时搜素树，在树的input框里触发回车键，整个页面被刷掉（仅仅在部分场景会这样，就很奇怪，同一个组件，在大多数场景里表现正常，在某些场景里就会有这样的问题）

原因分析：

1、尝试走读代码，没有发现端倪（业务代码贼多，贼繁琐）
2、直接展开思考（不再看代码），什么会造成这个问题------莫不是即时搜索树的input框的enter事件触发了表单的默认提交事件？试一试

事实证明果然是：即时搜索树input框的enter事件触发了表单的默认提交事件
奇怪的是：为什么只有在部分场景里会有这个问题，命名是同一个组件，是什么诱发了这个问题-----多项目并行，开发任务紧迫，没法深究了，先把bug改了

官方解释

When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form
翻译：当表单中只有一个单行文本输入字段时，用户代理应该接受该字段中的Enter作为提交表单的请求。

当一个 form 元素中只有一个输入框时，在该输入框中按下回车应提交该表单。
而触发了form的提交，就会导致页面刷新。

解决方案：

禁止掉表单默认的提交

纯html：

<form @submit.prevent></form>

vue项目：

<el-form @submit.native.prevent></el-form>

官方demo补充：

去监听表单的提交。并记录当前的 Event.timeStamp，然后阻止提交表单的默认操作