// 全局注冊的路由
Vue.use(VueRouter)

// 頁面路由跳轉(zhuǎn) 前進或者后退
this.$router.go(-1) // 后退

//push方法會向 history 棧添加一個新的記錄，而replace方法是替換當前的頁面，
不會向 history 棧添加一個新的記錄
<router-link to="/05" replace>05</router-link>
// 一般使用replace來做404頁面
this.$router.replace('/')

傳參:
    const userId = '123';
    //命名的路由
    this.$router.push({name:'user', params:{userId}});  //---> /user/123
    
    ***這里的 params 不生效 (重點情況)***
    this.$router.push({path:'/user', params:{userId}});  //---> /user
    
獲取參數(shù)：
this.$route.params.userId

url 形式：url 不帶參數(shù).
http:localhost:8080/#/user

傳參:
<router link ：to='/gameInfo/'+uid+"/"+gameid />

//路由中：
{
path:'/gameInfo/':uid/:gameid
name:gameInfo,
component:()=>import('./views/gameInfo')
}

獲取參數(shù):
//像這樣在url中傳入一個參數(shù)，這個參數(shù)可以是data中的一個數(shù)據(jù)，
//也可以是一個動態(tài)的參數(shù)，在gameInfo頁面接收參數(shù)的時候用params接收，比如：
this.$route.params.uid  //這里的uid是路由中：后邊的參數(shù)

傳參: (path 只和 query搭配, path不和params搭配)
this.$router.push({path:'/user', query:{userId: '123'}});
獲取參數(shù)：
this.$route.query.userId

url形式:url中帶參數(shù).
http:localhost:8080/#/user?userId=123
獲取參數(shù):
this.$route.query.userId

傳參:
<router link to='/gameInfo?uid='+uid />
獲取:
this.$route.query.uid

// 路徑直接寫:字符串
this.$router.push('home')  // 只是跳轉(zhuǎn),不傳參數(shù)
//對象
this.$router.push({path:'home'})   // // 只是跳轉(zhuǎn),不傳參數(shù)

router.beforeEach((to, from, next) => {
  // to 和 from 都是 路由信息對象
})

watch: {
  $route(to, from) {
     // to 和 from 都是 路由信息對象
  }
}

  <router-link
     class="icon-go"
     :to="{ name: '首頁'}"
     v-if="$route.matched[0].path=='/category'">
    </router-link>
    <span class="icon-go" @click="$router.go(-1)" v-else></span>
    <slot name="title"></slot>

const router = new VueRouter({
  routes: [
    // 下面的對象就是路由記錄
    { path: '/foo', 
    component: Foo,
    children: [
        // 這也是個路由記錄
        { path: 'bar', 
        component: Bar }
      ]
    }
  ]
})

const router = new VueRouter({
  routes: [
    {
      path: '/foo',
      component: Foo,
      children: [
        {
          path: 'bar',
          component: Bar,
          // a meta field
          meta: { requiresAuth: true ,keepAlive:true}//1.權(quán)限 2.內(nèi)存緩存，單頁面切換
        }
      ]
    }
  ]
})

    //一級路由 
    {
      path: '/foo',
      component: Foo,
      children: [
        {
          path: 'bar',
          component: Bar,
          // a meta field
          meta: { requiresAuth: true ,keepAlive:true}//1.權(quán)限 2.內(nèi)存緩存，單頁面切換
        }
      ]
    }
 
 
//一級路由的子路由
    { path: 'bar',component: Bar,meta: { requiresAuth: true ,keepAlive:true } }
 
//兩者都是    路由記錄

router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // this route requires auth, check if logged in
    // if not, redirect to login page.
    if (!auth.loggedIn()) {
      next({
        path: '/login',
        query: { redirect: to.fullPath }
      })
    } else {
      next()
    }
  } else {
    next() // 確保一定要調(diào)用 next()
  }
})