SOURCE

console 命令行工具 X clear

                    
>
console
const Home = { template: '<div>home</div>' }
const Foo = { template: '<div>foo</div>' }
const Bar = { template: '<div>bar</div>'}

const router = new VueRouter({
  mode: 'history',
  routes: [
    { path: '/', component: Home, },
    { path: '/foo', component: Foo, meta: { auth: true}},
    { path: '/bar', component: Bar, meta: { auth: true }}
  ]
})

router.beforeEach((to, from, next)=>{
	if(to.matched.some(m=>m.meta.auth)){
  	if(window.confirm('是否要导航到'+to.path)){
    	next()
    }else{
    	next(false)
    }
  }
})

new Vue({
  router
}).$mount('#app')  
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.10/vue.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/vue-router/3.1.6/vue-router.js"></script>

<div id="app">
  <h1>路由元信息meta</h1>
  <ul>
    <li><router-link to="/">/</router-link></li>
    <li><router-link to="/foo">/foo</router-link></li>
    <li><router-link to="/bar">/bar</router-link></li>
  </ul>
  <router-view class="view"></router-view>
</div>