'<NuxtLink> in Nuxt 3 only show the page's content after refreshing

I am trying to use <NuxtLink> to redirect in Nuxt 3.

However, my page won't show after the URL change. That means, after clicking the link, the URL changes to whatever is stated in the to="", but the content doesn't show unless I refresh the page. Wonder what did I do wrong.

Here is my Routing code

 <template>
      <div class="top-nav-tab">
        <NuxtLink to="/foundations"><h3>Foundations</h3></NuxtLink>
     </div>
   </template>

Here is my page code

<template>
  <h2>Foundation page</h2>
</template>


Solution 1:[1]

I've got the same issue so I use native javascript instead.

// Simulate a mouse click:
window.location.href = "/";

// Simulate an HTTP redirect:
window.location.replace("/");

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 kissu