Route jump operation for Nuxt. js of page jump nuxt link

  • 2021-09-16 06:00:57
  • OfStack

The route jump code is as follows:


<ul>
 <li><nuxt-link :to="{name:'index.vue'}">HOME page</nuxt-link></li>
 <li><nuxt-link :to="{name:'new-new'}">NEWS page</nuxt-link></li>
 <li><nuxt-link :to="{name:'plays-play'}">PLAY page</nuxt-link></li>
</ul>

Note:

to is preceded by a colon ":"

to is followed by a path such as "/page/index" (which can be followed by a string or an object). Same as above

Additional knowledge: nuxt-link of nuxt has a pit

If you follow the case of nuxt, remember, so directories such as PAGES directory you'd better be lowercase pages all directories are lowercase

Because when you type which line of code below,

< nuxt-link :to="{name: 'posts-id',params:{ id: post.id }}" > {{ post.title }} < /nuxt-link >

name actually points to the route, and the route is case-sensitive. Note that to is case-sensitive! ! !

So if your directory is uppercase PAGES

The above code should be written as

< nuxt-link :to="{name: 'POSTS-id',params:{ id: post.id }}" > {{ post.title }} < /nuxt-link >


Related articles: