语义UI自动完成响应无序到达

Posted 2021-05-02

我正在使用以下语义UI自动完成下拉列表：

$('.ui.dropdown').dropdown({
    minCharacters: 1,
    apiSettings: {
        url: '/api/people?q={query}'
    }
});

它有效，除了当我键入'abc'时，我的服务器的响应按照'abc'，'ab'，'a'的顺序返回，因此最终的渲染结果是'a'的建议集，而字段包含'abc'。

Semantic UI是否提供了处理此问题的标准方法，还是需要手动实施修复？

工作示例显示错误：https://jsfiddle.net/633h2wdx/（screencast）

答案

解决方案是在发出新请求时取消先前的请求。语义UI为此提供了一个标志（interruptRequests）。

$('.ui.dropdown').dropdown({
    minCharacters: 1,
    apiSettings: {
        url: '/api/people?q={query}',
        interruptRequests: true
    }
});

另一答案

您可以使用match属性

使用搜索选择时指定如何匹配值。

两者匹配文本和值

值仅与值匹配

文本仅与文本匹配

默认设置是两者

以上是关于语义UI自动完成响应无序到达的主要内容，如果未能解决你的问题，请参考以下文章

片段中的 Asynctask 未到达 onPostExecute

语义 UI 导航菜单的响应式替换

带有 servlet 的 jQuery 自动完成 UI 不返回任何数据

在 C# IHttphandler 上对 jQuery 自动完成的随机排序请求

如何使用 KnockoutJS 和 JQuery UI 创建自动完成组合框

如何设置 vscode 的代码片段，以便在自动完成后自动触发 vscode 的智能感知？