打开页面发现已经变成简化后的类名
- 查询参数传参
语法格式： to = '/path ? 参数名 = 值'
对应页面组件接收传递过来的值 ： $route.query.参数名
- 动态路由传参
配置动态路由：routes:[...,{path:'/search/:words',component:Search}]
配置导航链接：to = "/path/参数值"
对应页面组件接收传递过来的参数值：$route.params.参数名
查询参数传参
在Home.vue首页导航链接中 ，三个链接“程序员”，“前端”，“前端大牛”,点击之后均能跳转到Search.vue组件内容上，想要跳转之后获取链接参数，在跳转路径上加上？key=参数。点击链接跳转之后，地址栏路径会带上？key=参数
Search.vue组件上通过 $route.query.key 进行双大括号进行显示，但是在created中，需加this
动态路由传参：配置路由规则，配置导航链接，配置参数获取
配置路由规则，Search组件 地址栏路径后用动态参数名 ：words（任取)
配置导航链接，直接将需要的参数值写在地址栏路径后面 /参数值
配置参数获取，展示时直接$route.params.参数名。在created中是this.$route.params.参数名
其实就是配置路由规则时，用：参数名 动态地将导航链接地址中写的参数值进行接收
该路由规则就是匹配到根路径时，自动跳转到相应组件
在index.js中配置路由规则，在路由规则最后面写上匹配不到任何路径显示NotFound组件
在views文件夹下新建NotFound.vue组件，用来显示匹配不到路径的情况
在index.js中进行导入组件
- hash路由（默认）（带#）
- history路由(常用)