0

更新:虽然我还没有弄清楚这一点,但我找到了一个可行的替代方法:使用 Lunr.js 搜索 | 哲基尔法典

我一直在关注使用 lunr.js 进行Jekyll 搜索的 CloudCannon Academy 教程,但经过多次试验和错误后,我仍然无法正常工作。

当我打开我的默认 Web 浏览器 Microsoft Edge 时,出现以下错误search.js

search.js:47 
        
       Uncaught TypeError: idx.add is not a function
    at search.js:47:11
    at search.js:57:3

我一直在一步一步地学习教程,所以我基本上从上面链接的网页中复制了所有内容。我不明白的是,我当然已经像教程那样定义了 idx 。通过检查源代码,我已成功检索到所有帖子数据并将它们存储在 JSON 中。我做错了什么?

为了您的信息,我在下面附上了我的代码:

(function() {
  function displaySearchResults(results, store) {
    var searchResults = document.getElementById('search-results');

    if (results.length) { // Are there any results?
      var appendString = '';

      for (var i = 0; i < results.length; i++) {  // Iterate over the results
        var item = store[results[i].ref];
        appendString += '<li><a href="' + item.url + '"><h3>' + item.title + '</h3></a>';
        appendString += '<p>' + item.content.substring(0, 150) + '...</p></li>';
      }

      searchResults.innerHTML = appendString;
    } else {
      searchResults.innerHTML = '<li>No results found</li>';
    }
  }

  function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');
  
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split('=');
  
      if (pair[0] === variable) {
        return decodeURIComponent(pair[1].replace(/\+/g, '%20'));
      }
    }
  }
  
  var searchTerm = getQueryVariable('query');

  if (searchTerm) {
    document.getElementById('search-box').setAttribute("value", searchTerm);

    // Initalize lunr with the fields it will be searching on. I've given title
    // a boost of 10 to indicate matches on this field are more important.
    var idx = lunr(function () {
      this.field('id');
      this.field('title', { boost: 10 });
      this.field('content');
    });

    for (var key in window.store) { // Add the data to lunr
      idx.add({
        'id': key,
        'title': window.store[key].title,
        'content': window.store[key].content
      });

      var results = idx.search(searchTerm); // Get lunr to perform a search
      displaySearchResults(results, window.store); // We'll write this in the next section
    }
  }
})();
4

0 回答 0