Comment détecter plus loin une entrée de recherche focalisée ou non dans vue-instantsearch?

Question

Dans mon composant Search.vue J'ai besoin de détecter si l'entrée de recherche axée ou non afin de cacher les résultats de recherche si le curseur est ailleurs

je vue-instantsearch

Voici le code de ma section de modèle de composant custume

<template> 
    <ais-index index-name="getstarted_actors" :search-store="searchStore"> 
     <div class="col-md-10 col-sm-9"> 
      <ais-search-box :autofocus="true"> 
       <div class="input-group" ref="searchInputGroup"> 
        <ais-input placeholder="Find books..." 
           :class-names="{'ais-input': 'form-control'}" autofocus="true" > 
        </ais-input> 
        <span class="input-group-btn"> 
          <ais-clear :class-names="{'ais-clear': 'btn btn-default'}"> 
           <span class="glyphicon glyphicon-remove" aria-hidden="true"></span> 
          </ais-clear> 
          <button class="btn btn-default" type="submit"> 
           <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 
          </button> 
         </span> 
       </div> 
      </ais-search-box> 
      <ais-results v-show="searchStore.query.length > 0"> 
       <template scope="{ result }"> 
        <div v-on:click="searchResultClick(result)" class="found-item"> 
         <a> <span>{{ result.name }}</span> <span>{{ result.rating }}</span></a><br/> 
        </div> 
       </template> 
      </ais-results> 
     </div> 

    </ais-index> 
</template> 

Answer 1

Vous pouvez essayer:

<ais-input placeholder="Find books..." 
      :class-names="{'ais-input': 'form-control'}" autofocus="true" 
      @focus="onFocus" 
> 
</ais-input> 

et vos méthodes:

methods: { 
    onFocus() { console.log('Focused') } 
}