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>教大家如何快速跑起来一个 ...
随机推荐
- python调用虹软2.0
第一版踩了无数的坑,终于第二版把坑全添了,这次更新可以正常获取人脸数,角度,代码可读性更高,继续更新中 第三版已发出 https://www.cnblogs.com/wxt51/p/10125460. ...
- windows设置程序开机自启动
在msconfig里面进行设置的前提是,这个程序已经在自启动列表中,只是没有被勾选上, 对于不在该启动列表里的程序需要: ①找到这个应用程序所在的位置; ②右击发送到桌面快捷方式; ③在Window ...
- webpack踩坑之路 (2)——图片的路径与打包
刚开始用webpack的同学很容易掉进图片打包这个坑里,比如打包出来的图片地址不对或者有的图片并不能打包进我们的目标文件夹里(bundle).下面我们就来分析下在webpack项目中图片的应用场景. ...
- 如何获取select选中的值
一:JavaScript原生的方法 1:拿到select对象: var myselect=document.getElementById(“test”); 2.拿到选中项的索引: var index= ...
- Docker用途 & 和tomcat的区别
两者不是同一种类型.1.docker 是容器,tomcat是jsp应用服务器2.tomcat可以安装在物理机上,虚拟机上,也可以安装在Docker上.所以从这个角度讲,Docker也可以看做是一种超轻 ...
- OPSF - 2,状态机
1,报文更新地址 点到点:所有报文发送224.0.0.5 虚链路:单播地址 广播网络上:DR OTHER至DR/BDR 224.0.0.6,DR/BDR至DR OTEHER 2 ...
- adb 获取包名
1.aapt dump badging 指定的路径 +包名 ======= adb logcat|findstr START 2.顶部和尾部有包名和activity
- 『C++』STL容器入门
最近在学习opencv,因为C++基础很烂,所以遇到了不少问题,其中STL模块也是没少接触,特此简单了解一下STL的容器类型(主要是Vector)和迭代器的简单用法. C++ STL(标准模板库)是一 ...
- Codeforces Beta Round #64D - Professor's task
题意:两种操作1.加点2.查询点是否在之前给定点的凸包内 题解:set维护动态凸包,分别维护上下凸壳,对y取反就行,判断点是否在凸壳内,把点加进去看要不要删除就好了 //#pragma GCC opt ...
- ZOJ - 3661 pam
题意:给一个字符串,和每个字符代表的val,每个回文串的价值就是前半部分的val26进制%777777777,求价值第k小的回文串 题解:建个pam,然后dfs两边(0,1),统计价值sort一遍就好 ...