Realmente necesito ayuda porque todavía estoy aprendiendo sobre reaccionar js y la estructura de datos, quiero preguntar cómo filtrar datos de matriz específicos de redux y empujar a useState.
dataPortfo: [ { id: 0, title: "Retne Cms", link: "www.google.com", image: "/images/a1.png", category: "website", }, { id: 1, title: "Jaramba", link: "", image: "/images/a1.png", category: "website", }, { id: 2, title: "Atisiri Quiz Web", link: "", image: "/images/a2.png", category: "website", }, { id: 3, title: "Retne Cms", link: "www.google.com", image: "/images/a1.png", category: "mobile", }, { id: 4, title: "Retne Cms", link: "www.google.com", image: "/images/a1.png", category: "mobile", },],
Los datos anteriores de redux y uso Selector para obtener datos de la tienda redux.
const datePortfo = useSelector(selectPortfo); const [kategori, setKategori] = useState("all"); const [filterData, setFilter] = useState([]); const checkKategori = () => { if (kategori === "website") { console.log("web"); datePortfo.filter((data) => { if (data.category === "website") { console.log(data.category); setFilter([data]); } }); } if (kategori === "mobile") { console.log("mob"); } if (kategori === "all") { console.log("all"); } }; useEffect(() => { checkKategori(); console.log(filterData); // console.log(kategori); }, [datePortfo,kategori]); <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>Quiero mostrar datos específicos según la categoría, cuando intento con mi código y trato de filtrar los datos, solo muestre 1 datos. por favor ayúdenme, gracias chicos :) todavía soy novato
Creo que deberías hacer eso:
let filteredData = datePortfo; if(kategori != "all") filteredData = datePortfo.filter((data) => data.category === kategori); setFilter(filteredData);El método de filter crea una copia de la matriz, que debe guardar en una variable. La función que pasa para filter es un predicado que debe devolver true o false dependiendo de si la fila se retiene o no.
El resultado del filter que guardó se puede usar en setFilteredData .