Nuxt 防止为每个页面重新加载布局

【问题标题】：Nuxt prevent layout reload for evey pageNuxt 防止为每个页面重新加载布局
【发布时间】：2021-01-01 15:27:07
【问题描述】：

当布局加载（创建）时，我正在从 api 获取数据。因为数据需要时间并且不会改变，所以我只想在创建布局时加载一次并将其放入存储中。问题是每次页面导航都会调用 api。

有没有办法防止重新加载（为每个页面创建）布局？

【问题讨论】：

【解决方案1】：

如果你不想每次都获取数据，你可以像这样使用商店

在您要获取数据的已创建钩子中检查数据是否已存储...

computed: mapState([
   'yourData'
]),
created(){
   if(!yourData){
      // now you can fetch everything you want 
   }
}

【讨论】：

感谢您的回答。我试过了，但没有用。我使用 nuxtServerInit 函数解决了我的问题是 store/index.js 并且还使用了 nuxt-link 而不是锚标签。如下答案所示

【解决方案2】：

我在商店中使用 nuxtServerInit 方法解决了我的问题。我还用 nuxt-link 替换了我的锚标签

    //store/index.js
   ...
    async nuxtServerInit({ commit }) {
    try {
      await this.$axios.get("regions/get-all", config).then((res) => {
        if (res.status === 200) {
          commit("setRegions", res.data.regions);         
         
        }
      });
    } catch (e) {
      console.log(e);
    }    
  },

【讨论】：