当源是来自 Django 的字典时，使用预取 + 远程的 Typeahead Bloodhound 自动完成

Posted 2023-05-07

【中文标题】当源是来自 Django 的字典时，使用预取 + 远程的 Typeahead Bloodhound 自动完成

【英文标题】：Typeahead Bloodhound Autocomplete using prefetch + remote when source is a dict from Django

【发布时间】：2021-10-28 10:22:39

【问题描述】：

Bloodhound variable for Typeahead 运行良好：

var egDjangoVar = new Bloodhound(
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
  remote: 
    url: '/ajax/eg/%QUERY.json', 
    wildcard: '%QUERY',
    filter: filterdata
  
);

我们添加了 dict 解析函数filter: filterdata，因为 Django 要求将 JSON 作为 dict 发送以确保安全：

function filterdata(data)
      return $.map(data.results, function(results,index)
        return results.value;
      )
    

一切都很漂亮。我们现在想要Prefetch functionality 并添加了：

prefetch: 
    url: '/ajax/prefetch.json',
    wildcard: '%QUERY',
    filter: filterdata
  ,

这不起作用，尽管'/ajax/prefetch.json' 服务于预期的字典。我们认为这可能是由于dataTokenizer 问题discussed in this answer，但我们不明白为什么远程和预取源之间的标记器应该不同，并且建议的datumTokenizer: function(d) return Bloodhound.tokenizers.whitespace(d.value); 在添加它作为@ 的参数时不起作用987654331@.

我们发现本地存储中的__/ajax/prefetch.json__data 保存了与"datums":"Apple":"Apple","Banana":"Banana","Orange":"Orange","trie":"i":[],"c": 等值匹配的dict 键，而直接查看的远程数据则为"results": ["value": "Apple", "value": "Banana", "value": "Orange"]。这是意料之外的吗？

我是前端/JS 的新手，所以如果这是一个愚蠢的问题，请原谅我。我们做错了什么？

【参考方案1】：

想通了：filter 函数应该返回 results 而不是 results.value。

display:'value' 也从 Typeahead 初始化中丢失（其中 Bloodhound 变量被赋予 source）。