input聚焦，失去焦点的那些事

需求：
1：搜索输入时显示清空按钮和搜索按钮；
2：点击搜索按钮失去焦点，并查询；
3：点击清空按钮后重新聚焦；

需要解决的问题：
1：失去焦点需要别的处理的话要加延时器，跟内部机制执行顺序有关；
2：像清空时再次聚焦就需要mousedown事件处理，否则无法聚焦

代码示例

html

<view class="search-main">
              <input ref="searchInput" class="search-input" v-model="state.searchVal" placeholder="请输入关键字"
                @focus="isFocus" @blur="isBlur" @confirm="goSearch" clearable />
              <view class="right-box">
                <image class="del-img" src="https://lfrz1.stor.enncloud.cn/enn-oss/account2688/clear82798.png"
                  @mousedown="blutStop" @click.stop="clearInput" v-show="state.searchVal.length>0 && state.isFocu">
                </image>
                <view :class="['add-search',state.searchVal.length==0 && state.isFocu?'add-opacity':'']"
                  @click="goSearch" v-show="state.searchVal.length>0||state.isFocu">搜索</view>
              </view>
              <image class="search-ico" src="https://lfrz1.stor.enncloud.cn/enn-oss/account2688/sousuo52335.png">
              </image>
            </view>

js

     // 搜索框失去焦点
  const isBlur = (event) => {
    setTimeout(() => {
      state.isFocu = false;
    }, 300)
  }
  const blutStop = (e) => {
    e.preventDefault();
  }
  //去搜索
  const goSearch = () => {
    if (state.searchVal.length == 0) return
    Common.navigateTo({
      url: `/subPagesB/pages/helpCenter/search?value=${state.searchVal}`,
    });
  }
  //搜索框清空
  const clearInput = () => {
    state.searchVal = '';
    state.isClear = true;
  }