Vue: Como usar o localStorage com o vue?

Criado em 16 dez. 2015 · 3Comentários · Fonte: vuejs/vue

Postei no chat (duas vezes), ninguém respondeu, então espero conseguir ajuda aqui.

Eu tenho um mixin isLoggedIn() que retorna true se o item estiver presente no localStorage e false se não estiver.
Minha pergunta é, como posso reavaliar o estado quando atualizo ou removo o item do formulário localStorage, porque tenho alguns elementos mostrados apenas se isLoggedIn for true?

E é certo usar v-show="isLoggedIn()" ou você sugeriria outra coisa, não sei qual é a melhor prática para isso?

Obrigado rapazes.

Fonte

seemsindie

👍4

Comentários muito úteis

O problema aqui é que localStorage não é reativo, então você precisa de algo que seja reativo para acionar as alterações. Basicamente, você usa um objeto para representar o estado de login e, ao fazer login/logout, você modifica localStorage e esse objeto juntos (e inicializa esse objeto lendo de localStorage no carregamento do aplicativo).

Consulte http://vuejs.org/guide/application.html#State_Management
e https://auth0.com/blog/2015/11/13/build-an-app-with-vuejs/ que faz exatamente o que você está tentando fazer.

yyx990803 em 16 dez. 2015

👍24 😕7

Todos 3 comentários

Consulte http://vuejs.org/guide/application.html#State_Management
e https://auth0.com/blog/2015/11/13/build-an-app-with-vuejs/ que faz exatamente o que você está tentando fazer.

yyx990803 em 16 dez. 2015

👍24 😕7

@yyx990803 Obrigado cara, este artigo é exatamente o que estou tentando fazer.

seemsindie em 17 dez. 2015

Qual é o melhor lugar para verificar o armazenamento local na inicialização do aplicativo para ver se o usuário já fez login em uma sessão anterior? No tutorial referenciado, eles apenas têm uma linha dentro do arquivo de inicialização / main.js antes que o Vue seja inicializado. Já fiz algo parecido . Isso é recomendado?