Entrar Ainda não tem acesso?
3
respostas

Comportamento dos cartões ficou incompleto ao carregar do localStorage por usuário

Referente ao curso Progressive Web Apps: crie apps offline, no capítulo Adicionando os cartões ao localStorage e atividade Separando os cartões por usuário

por Camila Hatakeyama
| 42.2k xp | 2 posts

Faltou colocar o 

cartoesLocal.forEach(cartao => {
    preparaCartao(cartao)
})

dentro do pegaCartoesUsuario() para preparar cada cartão e assim funcionar corretamente a edição e remoção deles.

Como o mapeamento da lista é retornado direto nesta função, serão necessárias algumas modificações pra que este forEach acima seja executado e depois a lista seja retornada.

Minha função ficou um pouco diferente da original do curso, mas tem o mesmo resultado:

function pegaCartoesUsuario() {
    let cartoes = []
    let cartoesLocal = JSON.parse(localStorage.getItem(usuario))
    if (cartoesLocal) {
        cartoes = cartoesLocal.map(cartaoLocal => new Cartao(cartaoLocal.conteudo, cartaoLocal.tipo)) || []
        cartoes.forEach(cartao => {
            preparaCartao(cartao)
        })
    }
    return cartoes
}
3 respostas
por Wanderson Macêdo
| 3964.9k xp | 8086 posts
Instrutor Desenvolvedor

Opa Camila, tudo bem? Mas isso é um problema no código do curso em si? Se for a gente corrige. É neste exercício em específico?

por Camila Hatakeyama
| 42.2k xp | 2 posts

É um problema no código apresentado neste exercício mesmo. Percebi na aula seguinte que o instrutor tinha o código correto, mas que não foi apresentado no exercício que estamos falando.

A correção seria no bloco de código que fica logo após a frase "(...)posso dizer que isolarei tudo isso numa função (pegaCartoesUsuario):".

E a implementação da função que o instrutor Artur usa na aula posterior é a seguinte (achei melhor que a minha que mostrei acima):

    function pegaCartoesUsuario(){
        let cartoesLocal = JSON.parse(localStorage.getItem(usuario))
        if(cartoesLocal){
            return cartoesLocal.map(cartaoLocal => {
                let cartao = new Cartao(cartaoLocal.conteudo, cartaoLocal.tipo)
                preparaCartao(cartao)
                return cartao
            })
        } else {
            return []
        }
    }

Alem dessa mudança na implementação da função, seria necessário remover o 

  cartoes.forEach(cartao => {
    praparaCartao(cartao)
    })

que se encontra depois do 

let cartoes = pegaCartoesUsuario()

e antes do 

const render = () => _render({cartoes: cartoes, filtro: Filtro.tagsETexto}); render()
por Wanderson Macêdo
| 3964.9k xp | 8086 posts
Instrutor Desenvolvedor

Puxa, mas tipo, ele corrige mas não mostra no exercício, é isso mesmo? Se for isso mesmo, a gente corrige pra que mais gente não passe por esse problema.