As subcategorias não aparecem no projeto e eu já revi as aulas e acho que o código tá igual, alguém sabe resolver?
Categoria:
import React, { useEffect, useState } from "react";
import "../assets/css/blog.css";
import ListaCategorias from "../components/ListaCategorias";
import ListaPost from "./../components/ListaPost";
import {
Link,
Route,
useParams,
useRouteMatch,
Switch,
} from "react-router-dom";
import { busca } from "../api/api";
import SubCategoria from "./SubCategoria";
const Categoria = () => {
const { id } = useParams();
const { url, path } = useRouteMatch();
const [subcategorias, setSubCategorias] = useState([]);
useEffect(() => {
busca(`/categorias/${id}`, (categoria) => {
setSubCategorias(categoria.subcategorias);
});
}, [id]);
return (
<>
<div className="container">
<h2 className="titulo-pagina">Pet Notícias</h2>
</div>
<ListaCategorias />
<ul className="lista-categorias container flex">
{subcategorias.map((subcategoria) => {
<li
className={`lista-categorias__categoria lista-categorias__categoria--${id}`}
key={subcategoria}
>
<Link to={`${url}/${subcategoria}`}>
{subcategoria}
</Link>
</li>;
})}
</ul>
<Switch>
<Route exact path={`${path}/`}>
<ListaPost url={`/posts?categoria=${id}`} />
</Route>
<Route path={`${path}/:subcategoria`}>
<SubCategoria />
</Route>
</Switch>
</>
);
};
export default Categoria;
Subcategoria:
import React from "react";
import { useParams } from "react-router-dom";
import ListaPost from "../components/ListaPost";
const SubCategoria = () => {
const { subcategoria } = useParams();
return <ListaPost url={`/posts?subcategoria=${subcategoria}`} />;
};
export default SubCategoria;