Breaking News: Grepper is joining You.com. Read the official announcement!

search api in react js

Sourav Deka answered on July 27, 2022 Popularity 9/10 Helpfulness 1/10

answer search api in react js

related search in api react

search api in react js

Comment

function search(items) {
       return items.filter((item) => {
    /*
    // in here we check if our region is equal to our c state
    // if it's equal to then only return the items that match
    // if not return All the countries
    */
       if (item.region == filterParam) {
           return searchParam.some((newItem) => {
             return (
               item[newItem]
                   .toString()
                   .toLowerCase()
                   .indexOf(q.toLowerCase()) > -1
                        );
                    });
                } else if (filterParam == "All") {
                    return searchParam.some((newItem) => {
                        return (
                            item[newItem]
                                .toString()
                                .toLowerCase()
                                .indexOf(q.toLowerCase()) > -1
                        );
                    });
                }
            });
        }

Popularity 9/10 Helpfulness 1/10 Language javascript

Source: www.freecodecamp.org

Tags: api javascript search

Link to this answer
Share Copy Link

Contributed on Jul 27 2022

Sourav Deka

0 Answers Avg Quality 2/10

Closely Related Answers

search in api react

Comment

// Add Search in react from Api 
const [runData, setRunData] = useState([]);
  const [search, setSearch] = useState("");

  axios
    .get("https://www.anapioficeandfire.com/api/books?pageSize=30")
    .then((res) => setRunData(res.data))
    .then((err) => console.error(err));

// filter onChange
  const filterName = (e) => {
    setSearch(e.target.value);
  };

  return (
    <div className="App">
      <input text="text" onChange={filterName} placeholder="Search" />
    // add filter and if statement 
      {runData
        .filter((value) => {
          if (search === "") {
            return value;
          } else if (value.name.toLowerCase().includes(search.toLowerCase())) {
            return value;
          }
        })
        // 
        .map((list, index) => (
          <p key={index}> {list.name}</p>
        ))}
    </div>

Popularity 9/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Aug 03 2022

Yafet Segid

0 Answers Avg Quality 2/10

search api in react js

Contents

More Related Answers

search api in react js

Closely Related Answers

search in api react

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.