Vue 路由

网页根据不同的路径显示不同的内容，此时就需要路由组件。设置好路由后，可以跳转界面。
路由的两个模式：
history：h5提供的接口，当pushstate修改路径，不会向服务器发送请求，能够像正常路径一样。缺点是服务器需要做处理。
hash：除了多个#之外，最大的好处就是不需要服务器做配置。

动态路由：
访问此页面时可以加入id，

页面代码：

<template>
  <div>
    <h1>Hello</h1>
    <h2>ID:{{$route.params.id}}</h2>
  </div>
</template>

$就是固定找到全局的路由对象的变量名称。

效果：

生命周期：时间的节点。
路由守卫：跳转之前进行判断，如果是VIP用户就可以进入界面，如果不是就跳转到充值界面。

router.beforeEach((to,from,next)=>{
	console.log('跳转之前触发')
	if(to.path == '/lifecom'){
		next('/nopage')
	}else{
		next();
	}
})

<router-link to="/"> 跳转到首页 </router-link>