2021年3月17日星期三

Keep getting Uncaught TypeError: data.filter is not a function on my search bar filter

Anytime I try putting an input into the search bar it returns the data.filter is not a function error. been stuck on this for a few days and I am probably just unaware of some basic rule lol

Here is my JS, JSON and HTML for the searchbar function

const searchBar = document.getElementById('myInput')    let data = [];  console.log(searchBar)    searchBar.addEventListener('keyup', e => {  const searchTarg = e.target.value.toLowerCase();    const searchFilter = data.filter(info => {  return (        info.fields.toLowerCase().includes(searchTarg) ||      info.title.toLowerCase().includes(searchTarg)    )  })  displayProducts(searchFilter)   });    {    "items": [      {        "sys": { "id": "1" },        "fields": {          "title": "queen panel bed",          "price": 10.99,          "image": { "fields": { "file": { "url": "./images/product-1.jpeg" } } }        }      },      {        "sys": { "id": "2" },        "fields": {          "title": "king panel bed",          "price": 12.99,          "image": { "fields": { "file": { "url": "./images/product-2.jpeg" } } }        }      },      {        "sys": { "id": "3" },        "fields": {          "title": "single panel bed",          "price": 12.99,          "image": { "fields": { "file": { "url": "./images/product-3.jpeg" } } }        }      }  }      <input type="text" id="myInput" onkeyup="navSearch()" placeholder="Search for names..">        <ul id="myUL">          <li><a href="#">Adele</a></li>        <li><a href="#">Agnes</a></li>          <li><a href="#">Billy</a></li>        <li><a href="#">Bob</a></li>          <li><a href="#">Calvin</a></li>        <li><a href="#">Christina</a></li>        <li><a href="#">Cindy</a></li>      </ul>  

I did this based off many tutorials and can link the one I watched for the searchbar but idk if that is against any rules here, thanks for reading ^^

https://stackoverflow.com/questions/66684165/keep-getting-uncaught-typeerror-data-filter-is-not-a-function-on-my-search-bar March 18, 2021 at 11:04AM

没有评论:

发表评论