[Vue/Nuxt] プロパティの値の有無によるエラーハンドリング

VuexのStateのプロパティにオブジェクトで値が入っている場合において、
値の有無による条件処理でのエラーハンドリング実装方法の一例を紹介します。

今回は、
プロパティに値が入っていたらdispatchでActionsを発火させる
という場合のコードとなっております。

index.vue

<script>
export default {
  async fetch({ store }) {
    if (
      store.state.index.data &&
      Object.keys(store.state.index.data).length > 0
    ) {
      await store.dispatch('index/fetchData')
    }
  }
}

store.state.index.data
では単にdataプロパティに値があるかの確認。

且つ、
Object.keys(store.state.index.data).length > 0
でオブジェクト数が0より多いことを確認しています。