基于特定单词实现 CSS 自动完成排序

Question

我将Materialize CSS Autocomplete 用于我的 Google Apps 脚本，并从我的 Google 通讯录中填充数据。我希望能够根据联系人姓名中的特定单词对联系人出现的顺序进行排序。例如，假设我有以下联系人：

• 杰森·加西亚
• 乔纳森·杰克逊 手机
• 莫妮卡斯托克斯
• Amy Wang 手机
• 亚伦布里奇斯

我希望包含 Mobile 字样的联系人显示在列表顶部，其余按字母顺序显示：

• Amy Wang 手机
• 乔纳森·杰克逊 手机
• 亚伦布里奇斯
• 杰森·加西亚
• 莫妮卡斯托克斯

为此，我一直在尝试使用 Materialize CSS 文档中的 sortFunction，但没有成功。我怎么能做到这样？

Answer 1

您可以通过检查它是否包含术语“移动”来对数组进行排序，见下文。这将首先返回所有包含“mobile”的内容，然后返回所有其他内容。

const arr = ["Tom Mobile", "Sam", "Jess Mobile"]
arr.sort( (el1) => {
   if(el1.search(/mobile/gi) == -1) return 1
   return -1
}))

但这是针对数组的，您不需要数组，因此该答案是一般性的而不是具体的。因此，我快速演示了您真正想要的内容：

  document.addEventListener('DOMContentLoaded', function() {
    const options = {
        data : {
        "Tom mobile" : null,
        "Thomas" : null,
        "Tim mobile" : null
      },
      sortFunction : sortBy
    }
    var elems = document.querySelectorAll('.autocomplete');
    var instances = M.Autocomplete.init(elems, options);
  });
  
  // Sort function for sorting autocomplete results
  // prioritize if text contains mobile
  function sortBy(a, b) {    
    return  b.indexOf("mobile") - a.indexOf("mobile");
  }

参考

• array.sort()
• string.search()