ホームRailsの覚書Vue.jsの覚書MenuSidebarPrevNextSearchnuxtServerInitを利用して、vuex-persistedstateの情報をCookieの値で更新するはじめにローカルストレージはクライアントサイドのデータです。ページ更新時(F5)には内容が失われます。vuex-persistedstateを利用している場合、NuxtでSSRしようとすると、保持しているデータが消失します。こればかりはブラウザの仕様なのでどうにもなりません。false)にするのはナンセンスです。そこでSSRしていてもvuex-persistedstateのデータにアクセスできるよう、ページ更新時にはCookieからローカルストレージにデータをコピーするようにします。実装データのコピーにはnuxtServerInitを利用します。こちらのhookはSSRが行われる際のコールバック関数です。サーバ上で動作します。このタイミングでCookieの情報をvuex(ローカルストレージ上)に落とし込むことができれば、ページの更新時にもデータを参照できます。Storageを利用します。上記のコードによってvuex-persistedstateをCookieと同期させた上で、nuxtServerInitにより、SSR時にもCookieからローカルストレージに対して、データがコピーされるように処理を追加します。コードはstore/action.jsに記載します。これでページ更新時にも、vuex-persistedstateでstateを参照することが可能となります。