Sem a função buscar dentro do useEffect | React Router: navegação em uma SPA

2
respostas

Referente ao curso React Router: navegação em uma SPA, no capítulo Rotas aninhadas e atividade Criando SubCategoria

por Renan Augusto Lobato de Almeida Tavares

| 163.2k xp | 13 posts

Estágiario

nessa aula, no arquivo Categoria.jsx ele usa o hook useEffect() e dentro do hook ele usa a função busca e como segundo paramentro da funçãobusca ele usa uma função anônima.

porem no meu projeto eu decidir fazer diferente, não quis usar a função busca dentro do useEffect().

Alguem poderia me ajuda dps de fazer a requisição api?

meu codigo :

useEffect(() => {
    async function buscaSubCategoria(){
                const response = await api.get(`/categorias/${id}`)

        // como fazer essa funçao anonima aqui dentro?
    }

    buscaSubCategoria()
},[id])

Grato

2 respostas

por Vinícius Resende

| 75k xp | 17 posts

31/03/2021

Não estou acompanhando o curso, então se essa não for a resposta que você esperava me dê mais detalhes que eu tento te ajudar novamente :) . Vamos lá:

Pelo que eu entendi você quer alterar o estado do componente sem implementar a função busca, correto? Se sim, sem problemas! Eu arrisco ir além e dizer que esse é o jeito "mais correto" (mais limpo, se é que posso dizer assim).

Estou me baseando neste componente que o instrutor disponibilizou no GitHub. Seu código ficaria da seguinte forma:

const[categorias, setCategorias] = useState([])

useEffect(() => {
    async function buscaSubCategoria(){
        const response = await api.get(`/categorias/${id}`)

       setCategorias(response.data)
    }

    buscaSubCategoria()
},[id])

por Anna Rafaela Bispo De Santa

| 55.4k xp | 18 posts

Desenvolvedor

19/04/2021

Não sei se era isso que você esperava mas espero ter ajudado

const[categorias, setCategorias] = useState([])

 async function buscaSubCategoria(){
    const response = await api.get(`/categorias/${id}`);
     setCategorias(response.data);
 }
useEffect(() => {
    buscaSubCategoria()
},[id]);

Só fazendo uma observação, no useEffect o primeiro parâmetro é sim uma função anônima em que o é criada uma função e a chamada da função,

Como segundo parametro do useEffect é passado o array de dependências do hook , nesse casso o ID.