$router.back()想携带参数
时间: 2023-08-30 12:06:11 浏览: 120
$router.back() 方法本身是不支持携带参数的,因为该方法是用于浏览器的历史记录后退功能,无法传递参数。但是,可以通过在路由地址中携带参数,然后使用 $router.push() 方法进行路由跳转,再使用 $router.back() 方法进行后退,从而实现携带参数的后退操作。
具体实现步骤如下:
1. 在路由地址中携带参数,例如:
```javascript
this.$router.push({
path: '/home',
query: {
id: '123'
}
})
```
2. 在目标页面中获取路由参数,例如:
```javascript
this.$route.query.id
```
3. 使用 $router.back() 方法进行后退操作,例如:
```javascript
this.$router.back()
```
需要注意的是,如果使用 $router.push() 方法进行路由跳转时,需要使用 path 或 name 属性指定目标路由地址,不能使用 $router.back() 方法进行跳转。
相关问题
this.$router.back带参数
对于使用Vue.js的项目,可以使用this.$router.back()方法来返回上一页。但是该方法没有直接支持传递参数的功能。
如果你想要在返回上一页的同时传递参数,你可以通过以下几种方法实现:
1. 使用路由的query参数:你可以在路由跳转时通过query参数传递数据,在返回上一页时再从路由中获取数据。例如:
在当前页面跳转时:
```javascript
this.$router.push({ path: '/previous-page', query: { data: 'your data' } })
```
在返回上一页时获取数据:
```javascript
const data = this.$route.query.data
```
2. 使用路由的state参数:你可以在路由跳转时通过state参数传递数据,在返回上一页时再从路由中获取数据。例如:
在当前页面跳转时:
```javascript
this.$router.push({ path: '/previous-page', state: { data: 'your data' } })
```
在返回上一页时获取数据:
```javascript
const data = this.$route.state.data
```
请注意,这些方法只能在使用Vue Router进行路由管理的情况下使用。同时,返回上一页时,需要确保上一页的路由路径存在,否则将无法返回上一页。
$router.back() 返回如何携带参数
在 $router.back() 方法中,无法直接携带参数。该方法只是返回上一页,不会携带额外的参数。如果需要在跳转页面时携带参数,可以使用 $router.push() 方法,将参数以对象的形式传递到目标页面中。例如:
```
this.$router.push({
path: '/targetPage',
query: {
param1: 'value1',
param2: 'value2'
}
})
```
在目标页面中可以通过 this.$route.query.param1 和 this.$route.query.param2 来获取传递的参数值。
相关推荐
![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)