1
resposta

Informação do favorito não foi salvo no store

Seguindo as aulas não consegui fazer o meu estado de favoritar ficar persistido e ao atualizar a página ele estar marcado. Pesquisando nas IAs obtive a resposta que o problema era porque eu não estou alterando o array original ao usar o reduce do item e também o dado só está sendo alterado em mémoria e não está sendo persistindo, foi me dado o exemplo de código:

const persistedState = localStorage.getItem('reduxState')
? JSON.parse(localStorage.getItem('reduxState'))
: {};

const store = configureStore({
reducer: {
categorias: categoriasSlice,
itens: itensSlice,
},
preloadedState: persistedState,
});

store.subscribe(() => {
localStorage.setItem('reduxState', JSON.stringify(store.getState()));
});

export default store;

Talvez seja muito por conta das versões que estou utilizando, mas gostaria de entender melhor, se precisa de todo esse código mesmo, se teria uma abordagem mais simples e funcional.
PS: esse código resolveu o problema e o favorito começou a ser persistido. também aconselho a atualizarem a aula se for o caso

1 resposta

Henrique, ótima observação!

O que acontece é o seguinte: o Redux por si só não salva os dados de forma permanente. Ele mantém o estado apenas na memória enquanto a aplicação está aberta. Assim que a página é recarregada, esse estado volta para o valor inicial definido nos reducers.

Por isso você percebeu que o “favorito” sumia ao atualizar a página.

O código que você encontrou funciona porque:

  1. Recupera o estado salvo no localStorage (preloadedState) assim que a aplicação é iniciada;
  2. Salva automaticamente o estado atualizado sempre que algo muda no Redux (store.subscribe).

Ou seja, esse trecho é necessário se você quiser que o Redux se integre com o localStorage e mantenha os dados entre recarregamentos.