Laravel 5中Typeahead搜索：如何匹配带重音与不带重音的词汇

刚好之前做项目的时候也遇到过这个需求，给你两个实用的解决方案，亲测能解决重音不敏感匹配的问题：

这个方法不用动Typeahead的源码，只需要在初始化的时候自定义匹配逻辑，灵活又安全。

首先写一个通用的去除重音字符的工具函数，它能把带重音的字符转换成对应的无重音形式：

function removeAccents(str) {
  // 利用Unicode规范化分解，然后移除重音标记
  return str.normalize("NFD").replace(/[\u0300-\u036f]/g, "");
}

然后在初始化Typeahead的时候，重写matcher函数，把用户输入的关键词和选项文本都转成无重音、小写的形式再做匹配：

$('.your-typeahead-input').typeahead({
  source: ['vision', 'visión', 'visual', 'vídeo', 'niño'], // 你的数据源
  matcher: function(item) {
    // 统一转换为无重音+小写，避免大小写和重音影响匹配
    const normalizedQuery = removeAccents(this.query.toLowerCase());
    const normalizedItem = removeAccents(item.toLowerCase());
    // 做模糊匹配，返回是否包含关键词
    return normalizedItem.indexOf(normalizedQuery) !== -1;
  }
});

这样不管你输入vision还是visión，都能同时匹配到无重音和带重音的选项，完美解决需求～

如果你已经用了重音不敏感的修改版JS，但遇到未明确的问题，大概率是重音字符映射不完整或者源码引入顺序不对，可以按下面步骤排查：

• 确保引入顺序正确：先引入jQuery和Bootstrap，再引入bootstrap3-typeahead-ci.min.js，不要和原版bootstrap-typeahead.js同时引入。
• 补充重音映射规则：打开修改版的源码（如果是未压缩的版本），找到处理重音的字符映射对象，补充你需要的字符，比如：

// 示例：修改版里的重音映射，补充遗漏的字符
var accentMap = {
  'á':'a','é':'e','í':'i','ó':'o','ú':'u',
  'Á':'A','É':'E','Í':'I','Ó':'O','Ú':'U',
  'ñ':'n','Ñ':'N','ü':'u','Ü':'U','ç':'c','Ç':'C'
  // 可以根据需求添加更多重音字符
};

• 验证匹配逻辑：确认修改版里的匹配逻辑是先把输入和选项都通过accentMap转换后再做比较，而不是只处理了单方的文本。

如果修改压缩版的源码不方便，其实更推荐直接用方案1，自定义Matcher的方式更可控，也不用维护修改版的源码。

内容的提问来源于stack exchange，提问作者nature