vue3前端开发-小兔鲜项目-一级分类的路由设置

vue3前端开发-小兔鲜项目-一级分类的路由设置!之前的代码,我们没有做一级分类的路由设置,所以点击是默认停留在原始页面了,不会发生跳转。今天我们把路由设置好,让它实现动态路由跳转到一级分类页面去的效果。


1:第一步,我们提前 准备好一级分类的模块组件。

如图,在视图里面,下面,有category文件夹,里面我们已经创建好了一个简单的模板,index.vue,这是一个根组件,未来,这里面还会有很多子组件(展示各种不同的信息,不同的信息,有对应各自的子组件来完成承载。)


2:第二步,我们去修改一下路由的配置信息。

如图,我们在这个路径后面加上一个动态的参数,id

这样可以把接收过来的分量id,属性值绑定到了我们的路径里面去了。


3:然后,我们去修改一下,图层模板组件内的情况。

如图,一定要记住,动态渲染,前面少不了那个:冒号,别忘了。

还需要修改一个地方,固定在顶层位置的组件内也有这个代码块。

如图所示,这个也得改成动态渲染的,这样就可以实现参数id渲染进入路径了。

相关推荐
不坑老师9 分钟前
不坑盒子的插入网页功能是完全免费的!
前端·html
Wang's Blog13 分钟前
前端FAQ: 描述⼀下你最近使⽤过的前端框架,并解释为何选择它们?
前端·vue.js·faq
wgego13 分钟前
做题笔记BUU (XSS-Lab)(1-14)
前端·笔记·xss
dllxhcjla28 分钟前
css第二天
java·前端·css
callmeSoon30 分钟前
Solid 初探:启发 Vue Vapor 的极致框架
vue.js·前端框架·响应式设计
远航_31 分钟前
10 个被严重低估的 JS 特性,直接少写 500 行代码
前端·javascript
起这个名字32 分钟前
感觉这篇 DeepSeek 给出的微前端实践很牛!轻喷!
前端
小高00732 分钟前
当前端面临百万级 API 请求:从"修 CSS 的"到架构师的进化之路
前端·javascript·面试
P7Dreamer33 分钟前
package.json:你以为只是配置文件,其实是项目的命门!
前端·node.js
BBB努力学习程序设计34 分钟前
让数据阅读更轻松:隔行换色表格的妙用
前端·html