vue路由跳转时path和name的区别
用js实现跳转时有两种对应组合:this.$router.push({'name':one; params:{'id':id}});this.$router.push({'path':'/home'; query:{'id':id}});也就是name和params组合使用,path和query组合使用。区别:其实name和query也可以组合实现页面跳转,但是参数无法正常传递接收,params传
·
用js实现跳转时有两种对应组合:
this.$router.push({'name':one; params:{'id':id}});
this.$router.push({'path':'/home'; query:{'id':id}});
也就是name和params组合使用,path和query组合使用。区别:
其实name和query也可以组合实现页面跳转,但是参数无法正常传递接收,
params传递参数在地址栏是看不到的,就跟post请求很像。query参数会显示在地址栏,
项目如果对地址栏的保密有要求,项目就要用name搭配params传递参数。
或者对地址栏的参数进行加密:
在router的index.js文件加一下方法:
parseQuery(query) {
query = query ? aesDecrypt(query) : query;
var res = {};
query = query.trim().replace(/^(\?|#|&)/, '');
if (!query) {
return res;
}
query.split('&').forEach(function(param) {
var parts = param.replace(/\+/g, ' ').split('=');
var key = decodeURIComponent(parts.shift());
var val = parts.length > 0
? decodeURIComponent(parts.join('='))
: null;
if (res[key] === undefined) {
res[key] = val;
} else if (Array.isArray(res[key])) {
res[key].push(val);
} else {
res[key] = [res[key], val];
}
});
return res;
},
stringifyQuery(obj) {
var res = obj ? Object.keys(obj).map(function(key) {
var val = obj[key];
if (val === undefined) {
return '';
}
if (val === null) {
return encode(key);
}
if (Array.isArray(val)) {
var result = [];
val.forEach(function(val2) {
if (val2 === undefined) {
return;
}
if (val2 === null) {
result.push(encode(key));
} else {
result.push(encode(key) + '=' + encode(val2));
}
});
return result.join('&');
}
return encode(key) + '=' + encode(val);
}).filter(function(x) { return x.length > 0; }).join('&') : null;
return res ? ('?' + aesEncrypt(res)) : '';
}
这样在地址栏的路径还在,参数进行了加密,刷新页面还是能拿到参数。
更多推荐
已为社区贡献2条内容
所有评论(0)