vue路由跳转传参的两种方法
路由跳转:
this.$router.push({
name: '工单列表',
params: {p_camera_dev_name: 'xxx'}
});
使二级菜单呈点击状态:
$('[index*=\'/demo/test\']').trigger('click');
获取参数:
var thiz = this;
if(thiz.$route.params.p_camera_dev_name != undefined){
//使用
// 相关代码 //用完了,屏蔽掉
delete thiz.$route.params.p_camera_dev_name;
}
注意点:
(1)这边假设工单列表是二级菜单,对应的path是/demo/test
(2)注意跳转的时候是this.$router对象,而获取参数的时候是this.$route对象
(3)使用params传参数的时候, push里面只能是 name:'xxxx',不能是path:'/xxx', 如果params改成query,对应name需要改成path 则用如下形式:直白的来说query相当于get请求,页面跳转的时候,可以在地址栏看到请求参数,而params相当于post请求,参数不会再地址栏中显示
this.$router.push({
path:'/xxx',
query:{
id:id
}
})
采用sessionStorage, session级别的存在
sessionStorage.removeItem('xxxx'); //移除
sessionStorage.setItem('xxx', 'value'); //设置
sessionStorage.getItem('xxx');//取值
vue路由跳转传参的两种方法的更多相关文章
- 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之路由跳转 传参 aixos 和cookie
一.路由跳转 1.1 项目的初始化 vue create m-proj >>>创建vue项目 精简vue项目的 views 视图 About(基本是删除的) Home.(可以 ...
- vue路由(一个包含重定向、嵌套路由、懒加载的main.js如下)and 路由跳转传参的query和params的异同
import Vue from 'vue'import VueRouter from 'vue-router'import App from './App'Vue.use(VueRouter)cons ...
- ajax的data传参的两种方式
ajax的data传参的两种方式 本文为转载. 1.[javascript] view plain copy /** * 订单取消 * @return {Boolean} 处理是否成功 */ func ...
- jq ajax传参的两种方式
第一种 在url ? 后通过拼接传参 第二种 通过data传参 (1)第一种方法:(通过url传参) function GetQuery(id) { if (id ==1||id==7) { ...
- vue 页面跳转传参
页面之间的跳转传参,正常前端js里写 window.location.href="xxxxx?id=1" 就可以了: 但是vue不一样 需要操作的是路由history,需要用到 V ...
- Angular页面传参的四种方法
1. 基于ui-router的页面跳转传参 (1)在Angular的app.js中用ui-route定义路由,比如有两个页面, 一个页面(producers.html)放置了多个producers,点 ...
- angularJS 传参的四种方法 【修改】
1. 基于ui-router的页面跳转传参(1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers.html)放置了多个produce ...
随机推荐
- SRDC - ORA-1552: Checklist of Evidence to Supply (Doc ID 1681333.1)
SRDC - ORA-1552: Checklist of Evidence to Supply (Doc ID 1681333.1) Action Plan 1. Execute srdc_db_u ...
- MIPI CSI2学习(一):说一说MIPI CSI2
1. MIPI CSI2简介 MIPI联盟是一个开放的会员制组织.2003年7月,由美国德州仪器(TI).意法半导体(ST).英国ARM和芬兰诺基亚(Nokia)4家公司共同成立.MIPI联盟旨在推进 ...
- cobalt strike入门和防护
1.入门: https://blog.csdn.net/localhost01/article/details/86741124 2.cs的防护: 由于关乎渗透人员自身的安全,建议大家好好看看,这里贴 ...
- AtCoder - 2565(思维+暴力)
题意 https://vjudge.net/problem/AtCoder-2565 将一个H*W的矩形切成三份,每一次只能水平或者垂直切,问最大块的面积-最小快的面积 的最小值是多少. 思路 先枚举 ...
- MATLAB粒子群优化算法(PSO)
MATLAB粒子群优化算法(PSO) 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 一.介绍 粒子群优化算法(Particle Swarm Optim ...
- bootstrap如何去除自带的样式----导航栏中的菜单实现平滑的过渡到对应的菜单区域-------动态跟换模态框中的内容
问题1:如何去除bootstap中css中自带的overflow:hidden这个样式 今天遇见在bootstap中轮播图上的 附带图 片不能够显示出来,图片始终有一部分的高度 被隐藏了 后来通 ...
- 1.Python网络编程_UDP(简略版)
# -*- coding: utf-8 -*- #2019-11-24 import socket def recv(): udp_socket=socket.socket(socket.AF_INE ...
- 【转】gdb的调试与使用
转载自:https://www.jianshu.com/p/7a06b0bda2d8 gdb的调试与使用 这篇应该是我见过的总结最详细的gdb调试指南了,这位博主是个很强的人,他的博客对萌新比较友好, ...
- c# WF 第5节 窗体的控件
本节内容: 1:控件在哪里 2:控件怎么添加 3:窗口的显示与隐藏 4:实例单击窗体,出现另一个窗体 1:控件在哪里 视图 --> 工具箱 2:控件怎么添加 第一种:从工具箱直接拉 第二种:在代 ...
- Misc-不简单的压缩包
题目下载地址 https://ctf.bugku.com/files/e5a937a3985f5264a723bcbd0e062b0f/zip 友情连接同时也是网上看到的第一份关于这题的writeup ...