vue移动端项目搜索框实现键盘事件

1、首先把input类型改为seach，并用form包裹起来

2、其次把form的自动提交，刷新页面阻止掉

3、在methods中自定义键盘事件、以及form的submit事件

onSearchIcon(){
  console.log('搜索了')  
},
onSearchIcon2(e){
  if(e.keyCode == 13){
    this.onSearchIcon();
  }
},
formSubmit(){
  return false;
},

就可以实现移动端的软键盘搜索功能

但是随之而来我们又会发现一个问题，就是type设置为seach的时候，舒服过程中，输入框内会出来一个默认的 “X”，它比较丑，影响美观，那我们就要把它给去掉。

此时我们就需要

input[type=search]::-webkit-search-cancel-button{
  -webkit-appearance: none;/*此处只是去掉默认的小×*/
}

就可以去掉默认的小X号