vuex-persistedstateの値が復帰しない！？

VuexのStateを永続化したい時は

vuexのstateの値を永続化したい。そこで使っていたのが、vuex-persistedstate。

LocalStorageにstateの値を保持してくれる奴。使い方などは他の記事様などで詳しく書かれていると思うので、割愛させていただく。

問題

問題は、実際にリロードした時。stateに値があるかどうかで初期処理をしたい時に、stateの値を見ると…… undefindだった。
ん？ これっていつvuexに反映されてるの？

答え

mounted()が実行された後。
え、mounted()って表示コンポーネントが揃った後に実行されるんじゃないの？ mounted()が実行された後に戻ってくるということは、stateの値で判断して初期処理を変えたい時なんかはちょっと不便。

対処方法

mounted(){
  setTimeout(() => { // 反映されるのを待ってから実行
    // 初期処理
  }, 0)
}

まとめ

っていうだけの記事でした。