[460] how to fill data to component in layout when SSR

I have components/menu.vue component in layouts/default

it look like layouts/defaut

<div>
  <menu />
  <nuxt />
</div>

in components/menu.vue like

<div>
  <ul>
    <li v-for="m in $store.state.menu">{{m}}</li>
  </ul>
</div>

menu is fill data from http request . now , I use Vuex , It works very perfect in browser .

but when I check the source ( both browser source and after generate ) the menu is empty .

I think when SSR , that $store.state.menu is a empty array . but , component and layout can't use asyncData function fetch data . how can I fill data to component in layout when SSR ? I tried write ajax in pages/index.vue asyncData , but menu data just only fetch once . and I can't find way fill to layout .

my plugins/store.js looks like

import Vue from 'vue';
import Vuex from 'vuex';
import axios from 'axios';

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    menu: []
  },
  mutations: {
    replaceMenu(state, n) {
      state.somedata = n;
    },
  },
});

 (async () => {
   const { data } = await axios.get('http://request....');
   store.commit('replaceMenu', data);
 })();

export default store;