pagination to same level file but different folder in nuxt.js

I'm working on nuxt.js project and I'm stuck on pagination for about an hour.

my file structure is something like below

In my index.js file (pages/myDocument/_id/contents), I made a button and a function that simply takes a user to another index.js file (pages/myDocument/_id/blocks).

In my index.js(pages/myDocument/0/contents)

<template>
  // some codes in here
      <a class="btn" @click="linkTo()" >GO</a>
  // some codes in here
</template>

<script>
  linkTo: function(){
    this.$router.push('../0/blocks');
    console.log(this.$router);
  },
</script>

I can see 'VueRouter' in my console, so I'm sure the function linkTo is triggered. However, the page won't change and stays on the same page. For now I just hardcoded '0' as myDocument id. When I press the button, I can see the link on the google's search bar changes to '....:3000/myDocument/0/blocks', but it stays on the current page. What am I missing in here??

Read more here: https://stackoverflow.com/questions/66344135/pagination-to-same-level-file-but-different-folder-in-nuxt-js