ルーティング前に何がしかの判定をして、リダイレクトしたりとかしたいときありますよね。
somValue が true のときだけ、遷移を許可したいとか。
別に非同期である必要はないのですが、今回はたまたま。

import store from '@/store';
import { mapGetters, mapActions } from 'vuex';

export default {
  beforeRouteEnter (to, from, next) {
    store.dispatch('yourAction')
      .then(() => {
        if (store.getters['yourGetter'].someValue) {
          next();
        } else {
          next({ path: '/' });
        }
      });
  },

  created () {
    this.yourAnotherAction();
  },

  computed: {
    ...mapGetters('yourModule', [
      'yourAnotherGetter'
    ])
  },

  methods: {
    ...mapActions('yourModule', [
      'yourAnotherAction'
    ])
  }
}

やりたいことは実現できたし、Vue.jsの作者がそう言ってるので、良いのかな、と思うのだけど・・・。

なんか・・・変な気がする・・・。これでいいのか・・・？

※ツッコミお待ちしてます。

参考

Vue Router / ナビゲーションガード