如何使用按钮而不是搜索输入来过滤反应数据

Question

I am trying to filter products in React based on the category which is stored in NodeJs. The search using input is working as it should, but when I try to filter them using a button it only filters the first button (ex: Tart), and once I click on another button all the products disappear and nothing shows until I refresh the page. I have been trying for two days and I can't figure it out.

• Fetch data enter image description here

• Input filter and button filter enter image description here

• categories enter image description here

• products enter image description here

Answer 1

The problem here seems to be that you are using filteredProducts instead of using the state that you have assigned the value using setProduct ie, product.

You should do product.map(x)=>{...} instead.

And next time you post a question, please ensure that you are giving your code in text form instead of images as it's not really easy to read it otherwise.