vue跳转页面携带参数
2017年的时候使用Vue2.0做过一个系统,之后一直就在做JQuery,巩固了基础和数据库、java 的知识。2019年4月份开始用vue2.x来写,vue的基础的东西还是需要记录一下的。页面跳转:HTML:<span @click="addGoods" class="addGoods">新增进件</span>Script – methods :不携带参数直接...
·
2017年的时候使用Vue2.0做过一个系统,之后一直就在做JQuery,巩固了基础和数据库、java 的知识。2019年4月份开始用vue2.x来写,vue的基础的东西还是需要记录一下的。
页面跳转:
HTML:
<span @click="addGoods" class="addGoods">新增进件</span>
Script – methods :
不携带参数直接跳转:
this.$router.push({
path: '/datainputprogress'
})
携带参数:
var ordercode = this.tbodyArr[index].ordercode ;
var shopname = this.tbodyArr[index].shopname ;
var branchname = this.tbodyArr[index].branchname ;
this.$router.push({
path: '/datainputprogress',
query: {
ordercode: ordercode,
shopname:shopname,
branchname:branchname
}
})
***跳转后获取参数:***
**方法一:**
//获取地址栏信息
function getSearchString(key) {
// 获取URL中?之后的字符
var addrstr = location.href;
var str = addrstr.substring(addrstr.lastIndexOf("?") + 1, addrstr.length); //shopcode=125806649&branchcode=001&recommendid=6&openidfrom=&awardto=1001
// 以&分隔字符串,获得类似name=xiaoli这样的元素数组
var arr = str.split("&");
var obj = new Object();
// 将每一个数组元素以=分隔并赋给obj对象
for (var i = 0; i < arr.length; i++) {
var tmp_arr = arr[i].split("=");
obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]);
}
return obj[key] || '';
}
在created中:
created(){
this.ordercode = api.getSearchString('ordercode');
}
**方法二:**
toMallInfo: function(mallCode){
this.$router.push({
path: '/propertyInfo/mall/mallList',
// name: 'mallList',
query: {
mallCode: 'M000989'
}
})
},
created(){
this.getParams()
},
methods :{
getParams(){
// 取到路由带过来的参数
const routerParams = this.$route.query.mallCode
// 将数据放在当前组件的数据内
this.mallInfo.searchMap.mallCode = routerParams;
this.keyupMallName()
}
},
watch: {
'$route': 'getParams'
}
更多推荐
已为社区贡献1条内容
所有评论(0)