vue路由同页面重定向(vue同级路由跳转)
在Vue中,可以使用路由的重定向功能来实现同页面的重定向。
首先,在路由配置文件(通常是`router/index.js`)中,定义一个新的路由,用于重定向到同一个页面。例如,我们可以定义一个名为`Redirect`的路由,将其`path`设置为`/redirect`,并将`redirect`属性设置为需要重定向的页面路径,如`/home`。
```javascript
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = [
{
path: '/home',
name: 'Home',
component: () => import('../views/Home.vue')
},
{
path: '/redirect',
redirect: '/home'
}
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router
```
然后,在需要进行重定向的地方,可以使用`router.push()`方法将用户重定向到`/redirect`路由。
```javascript
methods: {
redirectToHome() {
this.$router.push('/redirect')
}
}
```
当用户调用`redirectToHome()`方法时,页面将会被重定向到`/redirect`,然后再自动跳转到`/home`页面。这样就实现了同页面的重定向。