小编Fur*_*cuk的帖子

@click 事件不会与带有 @blur 的元素一起触发

我在使用 VueJS 时遇到了一个问题,这有点让我感到紧张,因为我知道它可能依赖于一些非常小的东西,但我仍然在这里试图让它运行几个小时。

我正在使用一个模板,它应该代表一个搜索栏,其下有解决方案。为了显示解决方案,我正在循环一个对象(我还没有完成包括对该点的解决方案的过滤 - 想首先完成这个)。我现在想做的事情是用我在解决方案中选择的值填充搜索栏值(通过单击事件传递它)。但不知怎的,我的点击事件没有触发。

我有以下代码片段:

<template>
    <div class="input-group">
        <div class="input-group-prepend">
            <div class="input-group-text">&#128269;</div>
        </div>
        <input 
            type="text" 
            class="form-control"
            @focus="searchFocus = true"
            @blur="searchFocus = false"
            v-model="searchQuery"
            placeholder="Search for vehicles..">
        <div class="container p-0">
            <div class="dropdown-menu search" v-show="searchFocus">
                <a class="dropdown-item bus" href="#" 
                    v-for="vehicle in vehicleObjects" 
                    :key="vehicle.id.key"
                    v-on:click="setSelectedToQuery(vehicle)">
                    <span class="ml-4">Bus {{ vehicle.id.name }}
                        <span class="badge badge-secondary"> {{ vehicle.licenseNumber }}</span>
                    <span>
                </a>
            </div> 
        </div>
    </div>
</template>
Run Code Online (Sandbox Code Playgroud)

我错过了一些很明显的东西吗?如何运行/触发点击事件?

提前致谢

此致

javascript blur onclick vue.js vuejs2

2
推荐指数
1
解决办法
2156
查看次数

标签 统计

blur ×1

javascript ×1

onclick ×1

vue.js ×1

vuejs2 ×1