事件未在按鍵時觸發

Question

<multiselect v-model="value" :options="websites" label="url" track-by="url" :allow-empty="false" class="header-select mr-3" v-on:keyup.enter="submit"></multiselect>

要求 - 我有可搜索的下拉列表，最初我不會有任何下拉項目，但是一旦用戶輸入一個字母，我希望調用一個 api，它會給我一個以該字母開頭的下拉項目列表（例如，鍵入 A 應該返回蘋果，螞蟻...等）

簡而言之 - 我需要一個帶下拉菜單的輸入字段。 （類似於谷歌搜索）

按鍵事件在多選中不起作用，@change 等的事件可用於選擇該多選的下拉項目，但我希望按鍵工作並觸發事件。 - https://vue-multiselect.js.org/#sub-events

我使用了一個 npm 包 - https://www.npmjs.com/package/vue-multiselect ， https://vue-multiselect.js.org/ （我們不能用普通的輸入字段來實現這個嗎？Keypress 可以工作有，但如何將它與下拉列表結合起來？）

任何人都可以幫我解決這個問題，如果問題出在無法觸發按鍵事件的包上，有人可以為此目的建議另一個包嗎？

Answer 1

好的，所以我已經檢查了該組件的代碼庫，並且沒有 @keydown 事件，因為父級不是輸入。 它被包裹在一個 div 中。

當搜索詞更新時會觸發一個事件，可以在這里看到

你要監聽的事件是@search-change

例如

    <multiselect
    v-model="value"
    :options="websites"
    label="url"
    track-by="url"
    :allow-empty="false"
    class="header-select mr-3"
    @search-update="myFunctionThatWillTriggerSomething"
    v-on:keyup.enter="submit"/>

但請注意，在調用search-update事件時觸發 api 調用會向您的 api 發送垃圾郵件。 你會想看看去抖動它。