Um momento
Aula 34
Cursos / CRUD com o Redux (e React Native)
Correção do Problema Assíncrono dos Posts as Vezes não Serem Deletados

Summary

Resumo do Transcript

O áudio discute a resolução de um problema relacionado ao manejo de ações de exclusão (delete) de posts em uma aplicação. Aqui estão os pontos principais abordados:

  1. Erro de Lógica Inicial: O autor inicialmente mencionou que não era necessário remover o post deletado da lista de posts, mas depois corrigiu essa afirmação, explicando que é fundamental devido a problemas causados por pedidos assíncronos.

  2. Uso do Redux Thunk: O autor menciona que, se estivesse utilizando Redux Thunk, poderia retornar uma promessa ao deletar um post, o que facilitaria a manipulação do estado após a conclusão do pedido.

  3. Filtragem de Posts:

    • A solução envolve criar um reducer para deletar o post da lista.
    • O método filter é utilizado para criar uma nova lista de posts que exclui o post com o ID correspondente ao selecionado para deletar.
  4. Exemplo Prático:

    • O autor demonstra como filtrar uma lista de objetos em Node.js, exemplificando como remover um item da lista com base no ID.
    • É destacado que a comparação deve garantir que apenas posts com IDs diferentes sejam mantidos na nova lista.
  5. Correção de Erros:

    • O autor enfrentou alguns erros, como tentar acessar métodos de objetos indefinidos, e fez correções para garantir que o estado fosse acessado corretamente.
  6. Finalização:

    • Depois de várias tentativas e correções, o autor conseguiu resolver o problema de exclusão de posts.
    • Ele menciona que no próximo vídeo será abordado um bug semelhante relacionado à criação de novos posts.

Esse resumo encapsula os principais aspectos abordados na discussão, focando nos problemas encontrados e nas soluções propostas para a manipulação de posts em uma aplicação.

Video Transcript

Então, para resolver esse problema, o que a gente vai fazer? Aqui quando vai lidar com o delete post, a gente tem que remover o item, o supposed relacionado, o post que foi deletado da nossa lista, ó, né? Antes eu tinha dito que não precisava fazer isso, mas na verdade tem que fazer, desculpa. É por causa do pedido acinco no que dá esse problema. Se o, se o, se o, se o, se o destino ponto prop, ponto delet post, se a gente tivesse usado o chamado redux tank, eu poderia ter retornado uma promessa e dessa maneira eu teria usado o ponto den nessa promessa e dentro do den eu usaria o actions.list, certo? Essa maneira só iria mudar de cena depois que o pedido for realizado. A resposta vi. Nesse caso a gente não está usando redux tank, então por isso que está tendo esse problema. Então problema do last synchrono aqui, né? Então para resolver isso, o que a gente vai fazer? Vamos lá para o post reducer na delete post, o caso do delet, deletar post. A gente tem que filtrar, né? Pegar a lista de posts que já existe e criar uma nova lista. A gente vai filtrar ou remover aquele item que foi deletado. Se lembra que a gente tem o, o quê? Tem já o, o, o, como é, o ID, né? Do post selecionado. Então vamos fazer o quê? Vamos lá, vamos pegar aqui o all. Da mesma maneira que a gente fez um update post, a gente usou map lá, mas aqui a gente vai filtrar, então a gente vai usar essa função chamada filter, certo? Então só para revisar, eu vou, vou aqui no terminal para você ver como é que faz isso. Vou, estou aqui no node, vou criar a minha lista, né? Já tenho essa lista aqui, a lista de objetos. Então vamos filtrar esse ID, vamos adicionar um novo aqui, ID3. Vamos filtrar esse ID2, a lista, vamos tirar esse cara aqui, como é que a gente faz? Vamos fazer assim, ó, lista.filter. E o item é o argumento, primeiro parâmetro. E a gente vai filtrar se o quê? Se o item, o ID for 2. Tá bom? Ó, desculpa, não for 2. Só filter os caras de ID que não for 2, certo? É isso que remove o, o objeto corrigido ID é 2. Então só relembrando aqui, a gente usa o filter. Aqui o argumento item que vai ser cada um. E faz a comparação e retorna esse, o próprio item para adicionar uma nova array. Nesse caso primeiro o item vai ser esse objeto. Item.id não é igual a 2, verdade. Então se for verdade, pega esse item, adiciona uma nova lista. Nesse caso vai adicionar nessa nova lista aqui. Depois vai por 2, o item se torna 2, item.id é 2, não é igual a 2. Isso é falso, então não faz nada. Procega para o próximo item. Próximo item, o id é 3. Então item.id3, not equal, não é igual a 2, verdade. Então adicione esse item para a nova lista nesse caso aqui. Então fica com esse cara, a lista sem o caro de id2. Então vamos fazer dessa mesma maneira aqui. Então vamos dar o filter, o post, e qual é o post que a gente quer filtrar? Certo, a gente vai dar o quê? O post.id, a gente não quer que seja o post que foi selecionado, que tinha sido selecionado. Nesse caso o selector está dentro do estado. Então vamos dar selector.id, certo? Vai filtrar os posts e vai remover aquele que a gente tinha selecionado. Nesse caso é o post que foi removido. Então vamos adicionar esse cara no variável aqui, vou chamar de all. E vou adicionar aqui. Na verdade nem preciso desse cara aqui de copiar o state, que eu já estou fazendo esse. Mas eu deixei aqui no outro, mas nem precisa, porque não tem outras propriedades. Se tivesse outra propriedade eu teria que adicionar isso de novo. Sei lá se quiser deixar aí. Então selector, a gente pega a lista de posts, remove o post que foi, faz uma nova lista com todos os posts anteriores, acerto aquele que a gente removeu. E a gente retorna no novo estado com aqueles caras e seta o selector para no. Porque não tem mais posts selecionados. Vamos salvar aqui. Como eu estou usando a variável eu gosto sempre de adicionar esse bloco. Certo, vamos ver se vai resolver o problema. Vamos remover esse 2, 3, não sei o que. 1, 2, 3, KD. Ah, I cannot read proper filter of undefined. Ah, teve problema aqui. Não tem filter de indefinido, você não sabe que é all, porque eu esqueci de votar a state.all. Desculpa, então tem que acessar o all dos states desse cara aqui. Certo, vamos sentar novamente. Vamos deletar o AB. Editar, deletar, 1, 2, 3. Selected is not defined. Mais outro problema, eita, eu sou muito esquecido, então como é que a gente a isso? Eita isso. E aí, adiciona state, um selected. Esqueci também aqui. O selected está dentro dos states. Vamos de novo, espero, esperamos que não tenha mais erros, nem tem mais posts. Vamos ver o all high-all aqui, esse é o japonês. Editar, deletar, 1, 2, 3. Desapareceu, finalmente. Agora funcionou. Isso. Certo, então assim que agente esse problema. Que ele bug nem dava para notar por causa do action creator, o que era chamado. A resposta veio depois que a gente mudou de cena, né? Então estava tendo problema. Certo? No próximo vídeo a gente vai ver que esse bug também está presente na post new, né? Quando cria o novo post, às vezes acontece. Então até o próximo.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: