vue中enter回车键事件

项目中在搜索商品时，在没有搜索按钮的情况下，刚开始是写的当用户输入完成后，input框失去焦点blur事件处理，产品提议用户输入后，按enter回车键返回搜索结果。

• vue中失去焦点事件写法：@blur
• vue中enter回车键事件写法：@keyup.enter.native
  

<el-input v-model="searchName" @keyup.enter.native="toSearch()" placeholder="请输入搜索的名称"></el-input>

toSearch(){
 	console.log("搜索名称是：",this.searchName)
}

补充知识点：

• keydown、keyup 属于键盘事件，input 属于文本事件

详细说明：

• keydown：当用户按下键盘上的任意按键时触发，如果按住不放，会重复触发此事件。
• keyup：当用户释放键盘上的按键时触发。
• input：当元素内容发生改变时触发，这些元素指input、select、textarea 和指定了 contenteditable 属性的元素。

举例：

• 当我们在一个输入框中输入文本时，会依次触发下列事件：keydown 事件 ——> input 事件 ——> keyup 事件。