vue.js - 如何将 vue @click 事件附加到输入字段旁边的 font-awesome 图标？

Question

我尝试将 @click 添加到很棒的字体图标。但是，无论我向span还是i标签添加@click事件，它都不起作用。我怀疑该事件是由输入字段获取的。如何使放大镜图标可点击？

<div class="control has-icons-right">
    <input  v-model="keyword" @keyup.enter="findName" class="input is-large" type="text" placeholder="Input 1 word, hit Enter"/>
    <!-- or 2 words separated by space -->                      
      <span class="icon is-right" @click="findName">
        <i class="fa fa-search"></i>
      </span>
</div>

来源:3sName.com

Answer 1

这是因为，您正在使用bulma类.icon，它具有以下CSS。

pointer-events: none;

尝试用以下内容覆盖它

pointer-events: all;

pointer-events css 将阻止您的元素发出点击事件。

:)