vue.router返回判断是否有上一级
时间: 2023-12-05 21:49:41 浏览: 176
在 Vue.js 中使用 Vue Router,你可以使用 `$router` 对象来获取当前路由的信息,并使用 `$router.history` 属性来判断是否有上一级路由。
以下是一个示例代码,演示了如何判断当前路由是否有上一级:
```javascript
// 在 Vue 组件中
export default {
methods: {
hasPreviousRoute() {
const previousRoute = this.$router.history.current.matched.slice(-2, -1)[0];
return !!previousRoute; // 判断是否有上一级路由
}
}
}
```
在上述示例中,我们定义了一个 `hasPreviousRoute` 方法,该方法通过获取当前路由的 `matched` 数组中倒数第二个元素来判断是否有上一级路由。如果 `matched` 数组存在倒数第二个元素,则表示有上一级路由,返回 `true`;否则,返回 `false`。
在你的 Vue 组件中,你可以调用 `hasPreviousRoute` 方法来判断是否有上一级路由。例如:
```html
<template>
<div>
<p v-if="hasPreviousRoute">有上一级路由</p>
<p v-else>没有上一级路由</p>
</div>
</template>
<script>
export default {
methods: {
hasPreviousRoute() {
const previousRoute = this.$router.history.current.matched.slice(-2, -1)[0];
return !!previousRoute; // 判断是否有上一级路由
}
}
}
</script>
```
在上述示例中,根据 `hasPreviousRoute` 方法的返回值来展示不同的内容,如果有上一级路由,则显示 "有上一级路由",否则显示 "没有上一级路由"。
阅读全文