简体   繁体   中英

How can i search for keywords in a javascript array?

I am working on a search input component in a React project. I have an array of objects that I am mapping over when someone clicks search. The goal is to take the user input and use it to find something similar in the array. Right now I have to search the exact item for it to work. For example if I search "used car for sale" it will show that object but if I remove any words/letters it will not. Is there any way to only look for a keyword? Thank you!

function Search() {
  const items = [
    {
      title: "Used Car for sale",
      description: "I am selling a used 2003 Honda Civic. Works well.",
      price: "$1000",
    },
    {
      title: "computer for sale",
      description: "Selling a brand new Dell computer",
      price: "$800",
    },
    {
      title: "Used phone for sale",
      description: "I am selling my iphone 1",
      price: "$400",
    },
  ];

 
  const [text, setText] = useState("");

 

  const searchPosts = () => {
    items.map((item) => {
      if (item.title === text) {
        console.log(item);
      } else {
        console.log("item not found");
      }
    });
  };
  return (
    <>
      <h1>{posts[0].title}</h1>
      <div className="input-group mb-3 main-search">
        <input
          type="text"
          className="form-control "
          placeholder="Search for anything..."
          aria-label="Recipient's username"
          aria-describedby="button-addon2"
          onChange={(e) => setText(e.target.value)}
        />
        <div className="input-group-append">
          <button
            onClick={searchPosts}
            className="btn btn-outline-secondary main-search-button"
            type="button"
            id="button-addon2"
          >
            Search
          </button>
        </div>
      </div>
    </>
  );
}

You can split your words in the title field and check against the keyword you provide

In the first example 2 records are returned since inside the keyword string both words are contained within the records

In the second, all records are returned since sale is present in all elements

 const items = [{ title: "Used Car for sale", description: "I am selling a used 2003 Honda Civic. Works well.", price: "$1000", }, { title: "computer for sale", description: "Selling a brand new Dell computer", price: "$800", }, { title: "Used phone for sale", description: "I am selling my iphone 1", price: "$400", }, ]; function filterResults(list, keyword) { return list.filter(x => { const arr = x.title.toLowerCase().split(' '); return arr.some(y => keyword.toLowerCase().includes(y)) }); } console.log(filterResults(items, 'computer phone')) console.log(filterResults(items, 'computer'))

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM