導航欄沒有發送到正確的地方

Question

所以，我有一個附加了一些其他頁面的登錄頁面，例如，landing/gothere 將我帶到屬於 /gothere 的登錄部分，我有 /another 這是一個附加頁面問題是當我嘗試 go從/another到landing/gothere，因為我正在使用來自api的數據獲取着陸信息，當我點擊導航欄時，我將go放到正確的位置，但信息還沒有加載，然后Z8A5DA52ED126447A8A83AZ70加載頁面在我想去的地方和它帶我去的地方之間有這個差距。 在我將所有內容連接到 cms 之前，頁面工作正常。 這是我在導航欄中使用的 nuxt 鏈接

<nuxt-link
              :to="{
                name: 'index',
                hash: '#expertises',
                params: { offset: 100 },
              }"
              class="nav-link"
              >Nos expertises
            </nuxt-link>

PD：我已經嘗試過使用 this.$route 這樣的方式：

if (this.$route.params.hash) location.href = this.$route.params.hash;

將 nuxt 鏈接更改為：

<nuxt-link
              :to="{
                name: 'index',
                params: { hash: '#offres' },
              }"
              class="nav-link"
              >Nos offres
            </nuxt-link>

但是使用這種方法，導航欄只有在我在一個附加頁面中時才有效，如果我在登陸中，它就不起作用。 先感謝您

Answer 1

在 Nuxt 中，您可以等待 promise 得到解決，然后將服務器端呈現的應用程序返回給客戶端。 為了做到這一點，你可以嘗試下面的asyncData鈎子，就像mounted的鈎子一樣。

重要提示：這只能在頁面組件中使用 - 您的pages/文件夾中的組件

export default {
  props: ['someProp'],
  ...
  async asyncData() {
     await new Promise(resolve => {
       setTimeout(() => {
         resolve();
       }, 5000)
     });
  }
}

在這種情況下，我使用了一個簡單的 Promise，它在 5 秒后得到解決。 如果您現在在使用它的頁面上使用 go，您將在瀏覽器選項卡上看到一個微調器加載 5 秒，直到 Promise 得到解決。

您也可以在獲取時執行此操作，只需記住等待它。

強烈建議在此查看 Nuxt 文檔 - Nuxt Data Fetching