vue多页面应用页面返回 获取从哪个页面过来的吗
时间: 2023-09-01 15:05:27 浏览: 82
vue页面跳转后返回原页面初始位置方法
5星 · 资源好评率100%
在Vue的多页面应用中,可以通过使用路由的参数来获取从哪个页面过来的信息。
首先,在路由配置中设置参数接收页面来源信息。例如,在路由配置中添加一个参数名为source来接收来源页面的信息:
```javascript
routes: [
{
path: '/page1',
name: 'Page1',
component: Page1,
props: (route) => ({ source: route.query.source })
},
{
path: '/page2',
name: 'Page2',
component: Page2,
props: (route) => ({ source: route.query.source })
}
]
```
在页面跳转的地方,例如从Page1跳转到Page2时,可以携带来源页面的信息通过query传递:
```html
<router-link :to="{ name: 'Page2', query: { source: 'Page1' } }">Go to Page2</router-link>
```
然后,在接收来源页面的页面中,可以通过访问该页面的props来获取来源信息:
```javascript
export default {
props: ['source'],
mounted() {
console.log('来源页面:', this.source);
}
}
```
这样,在目标页面中就可以获取到从哪个页面过来的信息了。
需要注意的是,这种方式获取到的来源信息是通过路由的参数传递的,所以在浏览器的URL中也能看到。如果需要更加隐藏来源信息,可以考虑使用其他的方式,例如使用Vuex来管理页面状态。
阅读全文