vue 路由跳转,传参
一.直接跳转
//js
1.this.$router.push('/ad_new') //html
2.<router-link to="/ad_check">
<div class="top-menu-name">审核</div>
</router-link>
二.跳转传参
query传参,参数会显示在url后面?id=?
this.$router.push({
path: '/member',
query: {
id: id
}
})
路由配置
{
path: '/member',
name: 'member',
component: member
}
接收参数
this.$route.query.id
push 直接传参
this.$router.push({
this.$router.push('/member/'+id);
})
路由配置
{
path: '/member/:id',
name: 'member',
component: member
}
接收参数
this.$route.params.id
路由 name
this.$router.push({
name: 'member',
params: {
id: id
}
})
路由配置
{
path: '/member',
name: 'member',
component: member
}
接收参数
this.$route.params.id
vue 路由跳转,传参的更多相关文章
- vue路由跳转传参的两种方法
路由跳转: this.$router.push({ name: '工单列表', params: {p_camera_dev_name: 'xxx'} }); 使二级菜单呈点击状态: $('[index ...
- vue 路由跳转传参
<li v-for="article in articles" @click="getDescribe(article.id)"> getDescr ...
- vue路由跳转传参
this.$router.push({ path: '/message/result_notice', query: { id: id } }) // let type = this.$route.n ...
- vue路由(一个包含重定向、嵌套路由、懒加载的main.js如下)and 路由跳转传参的query和params的异同
import Vue from 'vue'import VueRouter from 'vue-router'import App from './App'Vue.use(VueRouter)cons ...
- vue 页面跳转传参
页面之间的跳转传参,正常前端js里写 window.location.href="xxxxx?id=1" 就可以了: 但是vue不一样 需要操作的是路由history,需要用到 V ...
- Vue ---- 组件文件分析 组件生命周期钩子 路由 跳转 传参
目录 Vue组件文件微微细剖 Vue组件生命周期钩子 Vue路由 1.touter下的index.js 2.路由重定向 3.路由传参数 补充:全局样式导入 路由跳转 1. router-view标签 ...
- Vue之路由跳转 传参 aixos 和cookie
一.路由跳转 1.1 项目的初始化 vue create m-proj >>>创建vue项目 精简vue项目的 views 视图 About(基本是删除的) Home.(可以 ...
- vue 中 this.$router.push() 路由跳转传参 及 参数接收的方法
传递参数的方法:1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用name ...
- vue 路由跳转带参 方式query ,params
a.vue向b.vue传值 a.vue this.$router.push({ path: '/payType', query: { putUpList: this.putUpList, name:' ...
- vue路由跳转传参数
1. router-link <router-link :to="{ path: 'yourPath', params: { name: 'name', dataObj: data } ...
随机推荐
- Loading class `com.mysql.jdbc.Driver'. The new driver class is `com.mysql.cj.jdb 问题
是因为最新的数据库驱动的原因,用较早的版本就可以了. <dependency> <groupId>mysql</groupId> <artifactId> ...
- 留恋 nyoj 854
留恋 时间限制:1000 ms | 内存限制:65535 KB 难度:2 描述 大家都知道,高中的时候,座位基本都是固定的,但是对于视力不好却又坐在后面的人是很不公平的. 念情的高中班主任安哥 ...
- 试题 E: 迷宫
[问题描述]下图给出了一个迷宫的平面图,其中标记为 1 的为障碍,标记为 0 的为可以通行的地方.010000000100001001110000迷宫的入口为左上角,出口为右下角,在迷宫中,只能从一个 ...
- Jenkins的配置从节点中默认没有Launch agent via Java Web Start选项问题
Jenkins的配置从节点中默认没有Launch agent via Java Web Start,如下图所示,而这种启动方式在Windows上是最方便的. 如何设置才能让出来呢? 1:打开" ...
- MQTT初步使用
环境搭建 1.mosquitto所需要的rpm包 2.c-ares-1.12.0 3.安装最新的openssl版本 4.mosquitto-1.4.10 mosquitto需要的rpm包 c-ares ...
- eclipse导入maven时,pom文件的project一直报错(Failure to transfer org.apache.maven.plugins:maven-surefire-plugin:pom:2.12.)
这里有两种解决办法. 一:右键项目->maven->update project勾选上Force Update of Snapshots/Releases然后ok就可以了. 二:如果第一种 ...
- 高可用Redis(十):Redis原生命令搭建集群
1.搭建Redis Cluster主要步骤 1.配置开启节点 2.meet 3.指派槽 4.主从关系分配 2.环境说明 两台虚拟机,IP地址分别为:192.168.81.100和192.168.81. ...
- netstat、ps、top 、kill 命令备忘
1.ps命令用于显示当前进程 (process) 的状态. -aux 显示所有包含其他使用者的行程. -e 显示所有进程. -f 全格式输出. 一般带参数 -ef 或者 -aux ,差别不大. 区别: ...
- webstorm 2019.1 注册教程
注册教程:https://blog.csdn.net/hdp134793/article/details/81530472 IntelliJ IDEA 注册码获取网站
- hibernate-第一章-基础
一,简介 hibernate是一个开源的ORM框架,它对我们的jdbc进行了轻量级的对象封装,它将我们的POJO与数据库表简历映射关系,是一个全自动的ORM框架;hibernate可以自动生成SQL语 ...