[JavaScript知识库]vue路由--Vue Router

路由

路由是指路由器从一个接口上收到数据包，根据数据包的目的地址进行定向并转发到另一个接口的过程。

设置路由器的主要目的是找到数据包从源到目的地的最有效路径。

什么是声明式路由,什么是编程式路由?

声明式:

	<router-link to="跳转的路径"></router-link>
	要链接到一个命名路由，可以给 router-link 的 to 属性传一个对象：
	<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>

编程式:

router.push({ name: 'user', params: { userId: 123 } })
	//替换掉当前的历史记录,会产生新的历史记录 
	this.$route.push('跳转的路径')		
	//替换掉当前的历史记录,直接返回首页面
	this.$route.replace('跳转的路径')	

$route和$router的区别

$router：路由器对象
$route：当前路由信息

$route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。而$router是“路由实例”对象包括了路由的跳转方法，钩子函数等

vue-router的作用是什么？ 为什么不使用a标签?

路由,主要用于组件切换,通过设置不同的path，切换视图，
向服务器发送的不同的请求，获取不同的资源

通过a标签和vue-router对比，vue-router避免了重复渲染，
不像a标签一样需要重新渲染，导致一些动态添加路由的机制失效

vue传参中params与query的区别

1）引入方式不同： query要使用path来引入，params要使用name来引入，接受参数格式类似，引用分别是this.route.query.name和this.route.query.name和this.route.params.name

2）形成的路径不同（或者url地址显示不同）：
使用query传参的话，会在浏览器的url栏看到传的参数类似于get请求，使用params传参的话则不会，类似于post请求。
params传递后形成的路径：/router/123,/router/zhangsan
query传递后形成的路径：/router?id=666&name=zhangsan

3）是否受动态路径参数影响
Query传递的参数不会受路径参数的影响，会全部展示到路径上，刷新不会丢失query里面的数据；
params传递的参数会受路径参数的影响，只会展示含有动态路径参数的部分，刷新会丢失没有设置动态路径参数的params的数据