Vue---this.$route和this.$router这两个对象--都需要在router.js 中配置
// 注意: 在 this 这个组件身上,有 this.$route 和 this.$router
// this.$route 是专门用来获取路由中参数的;
// this.$router 是专门来实现编程式导航的;
// 注意:this.$route和this.$router这两个对象
// this.$route是路由参数对象,所有路由中的参数,params,query都属于他
@click="goDesc"
methods: {
goDesc() {
this.$router.push("路径/home/goodsdesc/" + 参数this.goodsinfo.id);
}
}
rputer.js--配置
{ path: '/home/goodsinfo/:id', component: GoodsInfo, props: true },
2.首页tbar跳转---
标签跳转<router-link class="" to="路径/home"></router-link>
需要在router.js配置路由
<router-link tag="div" :to="'/home/goodsinfo/' + item.id" class="goods-item" v-for="item in goodslist" :key="item.id">
接收:data(){
return{
id:this.$route.params.id
}
}
3.在router.js中国配置路由的时候给组件定义名字属性
// 启用 props 来接收路由的参数
{ path: '路径/home/goodscomment/:id', component: 文件名字GoodsComment, props: true, name: '定义的名字goodscmt' }
this.$router.push({
name: "goodscmt",
params: { id: this.goodsinfo.id }
});
分类:
Vue学习
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义