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>教大家如何快速跑起来一个 ...
随机推荐
- Linux下的压缩解压缩命令详解及实例
实例:压缩服务器上当前目录的内容为xxx.zip文件 zip -r xxx.zip ./* 解压zip文件到当前目录 unzip filename.zip ====================== ...
- Object_C 与JavaScript交互使用总结
iOS开发中oc与js交互的方式有很多,我们可以使用流行的第三方库如:WebviewJavaScriptBridge和OVGap,这两个库都是让webview与JS建立起一条桥梁,我们也可以使用iOS ...
- angular在组件中选择dom元素
想选择 在组件中选择自己template里的dom元素,要使用ElementRef. import { Component, EventEmitter, HostListener, OnIni ...
- stm32复位引脚NRST
STM32F的NRST是异步复位脚. 当NRST输入低电平的时候,MCU处于复位状态,重设所有的内部寄存器,及片内几十KB的SRAM. 当NRST从低电平变高时,PC指针从0开始. 但是复位的时候不会 ...
- 练习:将从表读出来的时间戳除以1000(java读时间戳会多出3个000)用jackson包 实现
练习:将从表读出来的时间戳除以1000(java读时间戳会多出3个000)jackson包 实现 entity @Entity @DynamicUpdate //自动更新日期 @Data //get/ ...
- 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形网格动态加载
jQuery EasyUI 树形菜单 - 树形网格动态加载 动态加载树形网格有助于从服务器上加载部分的行数据,避免加载大型数据的长时间等待.本教程将向您展示如何创建带有动态加载特性的树形网格(Tree ...
- java --> Long和long/Integer和int
java中非一切是对象,因为还有基本数据类型. 基本数据类型有对应的基本数据类型打包器,它们的基本数据类型打包器是对象. j2se 5.0引入装箱和拆箱,它们是基本数据类型和基本数据类型打包器的关系 ...
- .NET的关于人脸识别引擎分享(C#)
https://www.cnblogs.com/RainbowInTheSky/p/10247921.html
- 利用adb安装apk
下载adb 网上资源很多,资源自寻. 配置环境变量 先加变量,后加入path.网上很多,不赘述. 安装apk 打开cmd,确保adb已经连接设备 adb install -r <拖动文件至cmd ...
- 走起 ~私有gitlab
1.创建gitlab 账号,创建一个项目名称 地址:http://git.limikeji.com 2.配置git环境 用git命令上传代码 3.配置gitlab ssh 4.使用git命令上传代码 ...