用户登录

Vue 应用的路由里的动态部分,我们可以创建一些名字里面用下划线开头的目录或者文件 .. 比如我打算创建一个路由,地址是 /posts/id .. posts 后面的 id 是地址里的动态部分..

在这个 pages .. posts 里面,添加一个新的 vue 文件 .. 名字是 _id.vue .. 组件里面先添加一个 template .. 里面是一个 div.container .. 然后是 h1 .. display-1 .. 标题文字是 Post .. 后面可以再绑定输出一个 $route.params.id .. 表示路由里面的 id 参数的值 ..

回到浏览器 .. 访问一下 posts 斜线,后面再加上一个 id 参数的值 .. 比如数字 3 .. 页面上会显示一个 Post 3 .. 再访问一下 posts/6 ... 这次页面上显示的是 post 6 ..

回到项目 ... 刚才我们在 pages/posts 下面创建了 _id.vue .. Nuxt 会自动生成一条路由 .. 打开 .nuxt .. router.js .. 在这个 routes 里面,你会发现有一个名字是 posts-id 的路由 .. 地址是 /posts/:id .. 在 Vue 应用里面,地址里带冒号开头的部分就是路由里的动态部分 ..

动态路由《 Nuxt.js:路由与视图 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点