时间:2021-05-26
路由跳转代码如下:
<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>注意说明:
to 前面有冒号“ : ”
to 后面跟的是路径比如“/page/index”(可以跟字符串或对象)同上↑
补充知识:nuxt的 nuxt-link 有个坑
如果你跟着nuxt的案例走,记住 ,所以目录 比如 PAGES 目录 你最好小写 pages 所有目录都小写
因为 当你敲下面哪行代码 时
<nuxt-link :to="{name: 'posts-id',params:{ id: post.id }}">{{ post.title }}</nuxt-link>
name其实指向的是路由,而路由死活区分大小写的 注意 to后面区分大小写!!!
所以如果你目录是 大写的 PAGES
以上代码要写成
<nuxt-link :to="{name: 'POSTS-id',params:{ id: post.id }}">{{ post.title }}</nuxt-link>
以上这篇Nuxt.js的路由跳转操作(页面跳转nuxt-link)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
Nuxt.js依据pages目录结构自动生成vue-router模块的路由配置。要在页面之间使用路由,我们建议使用标签。正文对我来说,Nuxt是我所用过最好用的
1.Nuxt里怎么使用vuex?Nuxt.js内置引用了vuex模块,所以不需要额外安装。Nuxt.js会尝试找到应用根目录下的store目录,如果该目
Nuxt.js是一个基于Vue.js的通用应用框架。通过对客户端/服务端基础架构的抽象组织,Nuxt.js主要关注的是应用的UI渲染。SSR,即服务器渲染,就是
为什么要用Nuxt.js公司现有的项目只有落地页是通过前端本身server读取pug文件进行服务端渲染的,当然是为了首屏加载速度以及SEO。Nuxt.js是一个
路由的动画效果,也叫作页面的更换效果。Nuxt.js提动两种方法为路由提动动画效果,一种是全局的,一种是针对单独页面制作。全局路由动画全局动画默认使用page进