vue.js - 非同期データを取得してサーバー側をレンダリングするコンポーネントを作成する方法は?

Question

asyncDatassr 環境で要求できるのはルーター コンポーネントのみであることがわかっています。サーバー側をレンダリングするためにいくつかの非同期データが必要です。ルーターコンポーネントではないためasyncData、サーバー側のレンダリングには使用できません。

そのため、非同期APIを呼び出すためにフックを使用createdしましたが、コンポーネントフックは同期的であり、約束を待ちません。サーバー側で非同期データを取得するにはどうすればよいですか?

App.vue - メイン コンポーネント

export default {
  components: {
    footer: Footer,
    header: Header,
    selector: selector
  },
  beforeMount() {
    // need preload metadata here
  },
  created () {
    // it return preload metadata as response.
    return this.$store.dispatch('GET_PRELOAD_META_DATA');
  }
}

Action.js

GET_PRELOAD_META_DATA: ({ commit }) => {
    return axios.get("api/preload").then(({ data }) => {
      commit('SET_PRELOAD_DATA', data);
    });
},