Vue.js 如何在vue instantsearch中检测搜索输入是否集中？

在我的组件

Search.vue

中，如果光标在别处，我需要检测搜索输入是否聚焦，以便隐藏搜索结果

我用了

下面是我的custome组件的模板部分的代码

<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>

{{result.name}{{result.rating}}

您可以尝试：

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

---

重复但使用Algolia我希望找到vue instantsearch的解决方案术语。为了避免使用自定义组件如果需要访问输入，如在我链接的帖子中，您必须使用

ais输入

。像这样的设置应该没问题

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