单输入框表单enter后页面刷新

2019.01.11今天在做一个搜索功能时发现，输入搜索字后点击搜索按钮没问题，但是按下enter键页面就刷新了一下，我就纳闷了，为啥之前写的都没有问题，就这里不能enter搜索，难道是因为前端搜索就不行？那也没道理啊，最终才发现：原来是因为，当<form>表单中只有一个输入框时enter键会执行表单的默认提交事件并刷新页面。
解决办法：

1. 处理表单的默认行为
   <form onsubmit="return false;">.......</form>
2. 如果你的表单时集成的框架，不能在表单标签上直接禁止它的默认行为的话，可以在表单中再写一个输入框并将其隐藏

   <form-group>
   	<el-input
           clearable
            v-model="tableInit.searchKey"
            class="front-search-input"
            icon="h-icon-search"
            :placeholder="$t('s.searchMonitor')"
            :on-icon-click="searchTable"
            @keyup.enter.native="searchTable"
            :clear-icon-click="clearSearchTable">
          </el-input>
       <el-input style="display: none;"></el-input>
   </form-group>
   

3. 当然也可以直接屏蔽回车键

   <input type="text"  onkeydown="return ClearSubmit(event)" />
   
    function ClearSubmit(e) {
         if (e.keyCode == 13) {
             return false;
         }
      }