react router @4 和 vue路由 详解(六)vue怎么通过路由传参?
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html
8、vue怎么通过路由传参?
a、通配符传参数

//在定义路由的时候
{
path: '/describe/:id',
name: 'Describe',
component: Describe
}
//在使用的时候
this.$router.push({
path: `/describe/${id}`,
})
//接收页面获取值
this.$route.params.id

b、params传参,跳转的时候不会显示在url上

//在定义路由的时候
{
path: '/describe',
name: 'Describe',
component: Describe
}
//在使用的时候
this.$router.push({
name: 'Describe',
params: {
id: id
}
})
//接收页面获取值
this.$route.params.id

c、query传参,传餐的时候在url显示? key=value & key=value

//在定义路由的时候
{
path: '/describe',
name: 'Describe',
component: Describe
}
//在使用的时候
this.$router.push({
path: '/describe',
query: {
id: id
}
})
//接收页面获取值
this.$route.query.id

react router @4 和 vue路由 详解(六)vue怎么通过路由传参?的更多相关文章
- 详解Python函数参数定义及传参(必备参数、关键字参数、默认可省略参数、可变不定长参数、*args、**kwargs)
详解Python函数参数定义及传参(必备参数.关键字参数.默认可省略参数.可变不定长参数.*args.**kwargs) Python函数参数传参的种类 Python中函数参数定义及调用函数时传参 ...
- react router @4 和 vue路由 详解(一)vue路由基础和使用
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 1.vue路由基础和使用 a.大概目录 我这里建了一个router文件夹,文件夹下有in ...
- angular路由详解六(路由守卫)
路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...
- react router @4 和 vue路由 详解(八)vue路由守卫
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 13.vue路由守卫 a.beforeEach 全局守卫 (每个路由调用前都会触发,根据 ...
- react router @4 和 vue路由 详解(四)vue如何在路由里面定义一个子路由
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 6.vue如何在路由里面定义一个子路由? 给父路由加一个 children:[] 参考我 ...
- Vue 路由详解
Vue 路由详解 对于前端来说,其实浏览器配合超级连接就很好的实现了路由功能.但是对于单页面应用来说,浏览器和超级连接的跳转方式已经不能适用,所以各大框架纷纷给出了单页面应用的解决路由跳转的方案. V ...
- vue技术栈进阶(02.路由详解—基础)
路由详解(一)--基础: 1)router-link和router-view组件 2)路由配置 3)JS操作路由
- 每天记录一点:NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发
每天记录一点:NetCore获得配置文件 appsettings.json 用NetCore做项目如果用EF ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...
- Ocelot简易教程(三)之主要特性及路由详解
作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9664977.html 上篇<Ocelot简易教程(二)之快速开始2>教大家如何快速跑起来一个 ...
随机推荐
- sort-桶排序
void list_insert(list<int> &t,int num) { auto iter=t.begin(); for(;iter!=t.end();++iter) { ...
- 关于前端SEO的一些常用知识总结
Search English Optimization,搜索引擎优化,简称为SEO. (1)网站结构布局优化:尽量简单 1. 控制首页链接数量:首页链接不能太多,一旦太多,没有实质性的链接,很容易影响 ...
- mint fcitx搜狗输入法不显示输入框,其他输入法丢失皮肤
mint18.3 因为这个原因刚刚重装过,结果一不留神又这样了. 这次原因相对清晰: 双屏显示下,合屏睡眠,打开之后,发现卡死了.屏幕分辨率改变了似的. 然后再重启,发现输入法悬浮框变大了,然后输入法 ...
- LeetCode第[20]题(Java):Valid Parentheses
题目:有效的括号序列 难度:Easy 题目内容: Given a string containing just the characters '(', ')', '{', '}', '[' and ' ...
- Mac python 环境配置
问题:mac 只带了python2.7,要想使用高版本的Python,如python3.x,只能再次安装了,这样就会遇到 两个版本的切换问题了 如下图 : 执行 which python 如下图,查看 ...
- 雷林鹏分享:C# 可空类型(Nullable)
C# 可空类型(Nullable) C# 可空类型(Nullable) C# 提供了一个特殊的数据类型,nullable 类型(可空类型),可空类型可以表示其基础值类型正常范围内的值,再加上一个 nu ...
- Mycat水平拆分之十种分片规则
水平切分分片实现 配置schema.xml 在同一个mysql数据库中,创建了三个数据库 testdb1,testdb2,testdb3.并在每个库中都创建了user表 <?xml ...
- LeetCode--012--整数转罗马数字(java)
罗马数字包含以下七种字符: I, V, X, L,C,D 和 M. 字符 数值 I 1 V 5 X 10 L 50 C 100 D 500 M 1000 例如, 罗马数字 2 写做 II ,即为两个并 ...
- BFS+二进制状态压缩 hdu-1429
好久没写搜索题了,就当练手吧. vis[][][1025]第三个维度用来维护不同key持有状态的访问情况. 对于只有钥匙没有对应门的位置,置为'.',避免不必要的状态分支. // // main.cp ...
- 【洛谷p1313】计算系数
(%%%hmr) 计算系数[传送门] 算法呀那个标签: (越来越懒得写辽)(所以今天打算好好写一写) 首先(ax+by)k的计算需要用到二项式定理: 对于(x+y)k,有第r+1项的系数为:Tr+1= ...