vue中window.location.href
时间: 2023-08-23 17:16:43 浏览: 76
在Vue中,使用window.location.href进行页面跳转可能会失效。这是因为在提交表单后,页面会刷新并且跳转到表单提交的目标页面,而不是执行window.location.href的跳转操作。为了解决这个问题,可以将按钮的类型从submit改为button。这样点击按钮时不会触发表单的提交,而是执行window.location.href的跳转操作。[1]
在Vue中,可以通过以下代码实现页面跳转并传递参数:
```javascript
methods: {
LookOrderGrab(item) {
let str = JSON.stringify(item);
window.location.href = "/Shop/WB/LookOrderGrab?item=" + encodeURI(encodeURI(str));
},
},
```
在跳转的目标页面中,可以通过以下代码接收参数:
```javascript
created() {
let that = this;
that.$nextTick(() => {
var item = that.GetRequest().item;
var obj = JSON.parse(decodeURI(decodeURI(item)));
console.log(obj);
});
},
methods: {
GetRequest() {
var url = location.search;
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
return theRequest;
},
},
```
以上代码中,LookOrderGrab方法用于跳转页面并传递参数,GetRequest方法用于获取跳转后的页面中携带的参数。注意在跳转时需要对参数进行编码和解码,以确保参数的正确传递和解析。[2][3]
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)