将获取数据过滤到复选框 react.js

Question

Maybe someone has an idea how to filter the data in the checkboxes. I already have a tag filter, but I don't know how to transform it to additionally filter my prices.
I need to filter by prices, eg I have a price of $ 9.99, $ 24.49 and $ 19.98 $ 20.00 - I need to make a filter:
"<$ 10", "$ 10- $ 20", "> $ 20"

DEMO here: https://codesandbox.io/s/blissful-sound-b3vm3?file=/src/App.js

data fetch from data.json

---

  function search(data) {
    return data.filter(
      (item) =>
        (filterParam === 'All' || item.tags.includes(filterParam)) &&
        (searchParam.length === 0 ||
          (searchParam.every((tag) => item.tags.includes(tag)) &&
            JSON.stringify(item).toLowerCase().indexOf(q.toLowerCase()) > -1))
    )
  }

Answer 1

Add a second filter and state object, and filter by that new param.

const [priceFilterParam, setPriceFilterParam] = useState("All");

function search(data) {
  return data.filter(
    ...
  ).filter(item => {
    const price = parseFloat(item.price.substring(1));
    return (priceFilterParam === "All") ||
      (priceFilterParam === "Low" && price <= 10) || 
      (priceFilterParam === "Medium" && price > 10 && price <= 20) ||
      (priceFilterParam === "High" && price > 20)
  })
}