Nuxt.jsでウェブストレージを扱う - Qiita

はじめに ウェブストレージ便利ですよね、特にローカルストレージはCookieが使えないPWAや、DBを用意するほどでもないちょっとしたデータを保存したいときに使うことが多いのではないかと思います。 ただ、いざウェブストレージのデータを扱おうと実装を進めるとデータの同期や保存のタイミング等でつっかかることがままあります。 そこで今回はNuxt.jsでウェブストレージを簡単に扱う手法を考えましたので簡単にご紹介しようと思います。 実装方針 コンポーネントやページから直接ウェブストレージにアクセスしていると処理やデータが散乱してしまい辛い状況に陥りやすいです。 そこで、ウェブストレージの参照や処理は全てストアに一本化します。 各コンポーネントやページは共通のステートやアクションを参照することになりますのでデータが非常に扱いやすくなります。 実装 入力した値をウェブストレージに保存する簡単なデモを