uniapp实现input自动对焦

需求：最近在做电商项目的时候使用到了uniapp的搜索插件，但产品经理觉得插件有些不够人性化。需要页面进入就让搜索框处于自动对焦状态

代码：

<input :placeholder="placeholder" 
@input="inputChange" 
confirm-type="search" 
@confirm="triggerConfirm" 
class="input" 
:class="{'center':!active && mode === 2}" :focus="isFocus" v-model="inputVal" 
@focus="focus"
@blur="blur" 
ref="searchInput" />

属性：

  data() {
    return {
      active: false,
      inputVal: "",
      searchName: "取消",
      isDelShow: false,
      isFocus:false,
    };
  },

方法：

   focus() {
	  this.active = true;
	  this.isFocus=true
      //HM修改 增加获取焦点判断
      if (this.inputVal) {
        this.isDelShow = true;
      }
    },

uniapp已经为我们提供了自动对焦的属性(focus)和方法@focus。我们只需要在vue的生命周期中进行调用即可。这样页面进入时就会自动对焦