<body>
<div id="app">
<div>
<router-link to="/home">home</router-link>
<router-link to="/news">news</router-link>
<router-link to="/test">test</router-link>
</div>
<div>
<router-view></router-view>
</div>
</div>
</body>
</html>
<script src="https://cdn.jsdelivr.net/npm/...;></script>
<script src="https://unpkg.com/vue-router/...;></script>
<script>
var home = {
template: <div>我是主页</div>
}
var news = {
template: <div>我是新闻</div>
}
var test = {
template: <div>我是测试</div>
}
const routes = [
{ path: '/home', component: home },
{ path: '/news', component: news },
{ path: '/test', component: test },
]
var router = new VueRouter({
routes
})
new Vue({
el: '#app',
router
})
router.beforeEach((to, from, next) => {
next({path:'/test'})
})
</script>
next({path:'/test'})是不需要传参数的,或者是需要判断该传什么参数,不然就会陷入死循环,如果当前页面已经是test了,还会进入test,就是盗梦空间了。
根据自己的需求判断next该怎么跳转