vue element 中 select 和 button 的回车事件

按回车时隐藏 element 中 el-select的下拉框

<el-select ref="selectref" 
		   v-model="reportType" 
		   placeholder="请选择" 
		   @visible-change="visibleType">
   <el-option
      v-for="item in typeOptions"
      :key="item.value"
      :label="item.label"
     :value="item.value">
  </el-option>
</el-select>

看官方文档,要使用visible-change
在methods中写上下面的方法

// 是否显示下拉框
    visibleType(e){
    console.log(e); //为true则显示,false则隐藏
      if(!e) {
        this.$refs.selectref.blur();
      }
    },

给element 中的 el-button 添加回车事件

<el-button slot="append" @click="handelSearch()">查询</el-button>

在created中添加下面逻辑

 created(){
    this.getLatestnewslist();
    var that = this;
    document.onkeydown = function(e) {
      var key = window.event.keyCode;
      if (key == 13) {
        that.handelSearch();
      }
    }
  },

在这里插入图片描述
如果一个页面中既有select选择框,又想给button按钮添加回车时间,就可以组合上面两个代码逻辑,有多个select选择框时,不能使用同一个函数,这样只有最后一个select有效。