要点:
写入两个组件,这两个组件内容就是需要页面切换的内容
安装 vue-router
然后进行引用和使用,当时我们在讲vuex的时候,就是说引了和使用了vuex之后就会出现一个全新的配置项store这边也是类似的
引用后就可以使用一个全新的配置项
然后创创建一个router文件夹,里面写入index.js专门用来创建整个应用的路由器
要引用vue-router 还有引用配置路由的组件
然后进行创建和进行路由的配置,并进行暴露
然后在main,js里进行引用该文件进行配置router
当运行页面发现上面路径有#就说明路由器已经开始工作了
此时我们已经实现了红圈的配置好了路由器
而我们这边就要使用了router库中给我们的一个标签进行点击实现切换路由
使用router-link 其中to代表对应的路径
发现router-link标签样式上和a标签没有差别 发现自动转成了a标签
然后加入一个active-class标签属性,就代表对应哪个路径被激活就触发哪个样式
active为class样式
但是此时vue不知道这边里面要放的是什么内容跟插槽一样,它不知道放在哪里
在需要添加组件的位置加入一个router-view标签