Vue: vueでlocalStorageを使用する方法は？

作成日 2015年12月16日 · 3コメント · ソース: vuejs/vue

チャットに投稿しましたが（2回）、誰も答えてくれなかったので、ここで助けが得られることを願っています。

アイテムがlocalStorageに存在する場合はtrueを返し、存在しない場合はfalseを返すミックスインisLoggedIn（）があります。
私の質問は、isLoggedInがtrueの場合にのみいくつかの要素が表示されるため、localStorageからアイテムを更新または削除するときに状態を再評価するにはどうすればよいですか？

そして、v-show = "isLoggedIn（）"を使用するのは正しいですか、それとも何か他のことを提案しますか、これのベストプラクティスはわかりませんか？

みんなありがとう。

ソース

seemsindie

👍4

最も参考になるコメント

ここでの落とし穴は、localStorageがリアクティブではないため、変更をトリガーするためにリアクティブなものが必要であるということです。基本的に、オブジェクトを使用してログイン状態を表し、ログイン/ログアウトするときに、localStorageとそのオブジェクトを一緒に変更します（アプリの読み込み時にlocalStorageから読み取ることでそのオブジェクトを初期化します）。

http://vuejs.org/guide/application.html#State_Managementを参照してください
そしてhttps://auth0.com/blog/2015/11/13/build-an-app-with-vuejs/は、あなたがやろうとしていることを正確に実行します。

yyx990803 2015年12月16日

👍24 😕7

全てのコメント3件

yyx990803 2015年12月16日

👍24 😕7

@ yyx990803ありがとう、この記事はまさに私がやろうとしていることです。

seemsindie 2015年12月17日

アプリの初期化時にローカルストレージをチェックして、ユーザーが前のセッションから既にログインしているかどうかを確認するのに最適な場所はどこですか？参照されているチュートリアルでは、Vueが初期化される前に、スタートアップファイル/ main.js内に行があります。私は似たようなことをしました。それはお勧めですか？