开发者学堂课程【微服务+全栈在线教育实战项目演练（SpringCloud Alibaba+SpringBoot）：整合课程和名师页面】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/667/detail/11429
整合课程和名师页面
路由（nuxt 路由）
1、固定路由
(1)使用 router-link 构建路由，地址是/course
<router-link to="/course"tag="li"active"class="current"><a>课程</a>
</router-link>
(2)在 page 目录创建文件夹 course，在 course 目录创建 index. vue
现在点击首页就是首页数据，当点击课程时候就显示课程数据，点击不同路由会显示不同页面
Nuxt 路由：
有两种路由，分别是固定路由和动态路由。
第一种 固定路由（路径是固定地址，不变）
比如现在点课程，就会进入课程页面，点名师会到名师页面
但是这个路径是不变的，以课程为例
<a>首页</ a>
</router-link>
I<router-link to="/course"tag="li"active-class="current">
(a)课程(/a>
</router-link>
<router-link to="/teacher"tag="li"active-class="current">
<a>名师</ a>
</router-link>
Krouter-link to="/article"tag="li"active-class="current">
<a>文章</ a>
</router-link>
<router-link to="/qa"tag="li"active-class="current">
<a>问答</a
</router-link>
</ul>
To 属性设置路由跳转地址，目前的地址是/course
如果要让/course 到页面中去
做法：在 pages 里面创建文件夹 course
在 course 文件夹创建 index.vue
效果就是显示了课程列表，现在点课程就进入到了课程页面，进来之后需要进入详情页面，详情就是详细信息，这里是显示标题和图片，点进去之后会看到更详细的信息，比如里边哪些章节是哪个老师讲的，以及分类是都有的。
第二种 动态路由
每次生成路由地址不一样，比如课程详情页面，每个课程 id 不一样
点击课程，然后点击课程页面中的每个课程，每个课程里边都有小的章节，都是分类的，里边是详情页面，一点课程id 就会多一个1，每次点击超链接，都会出现不同的id，这就叫动态路由。
2、动态路由
(1)创建方式
如果我们需要根据 Id 查询一条记录，就需要做用动态路由。NUXT 的动态路由是以下划线开头的 vue 文件，参数各为下划线后边的文件名，比如-id.vue
在 pages 下的 course 且录下创建-id、vue
当点击某一个课程，根据 id 查询，就会进入详情页面。
讲师详情和课程这个也是一样的，点讲师就是会出现讲师的详情
在课程里边有章节，之后会实现小节里的内容会播放视频，课程可以免费播放，如果需要付费的话应该会有支付机制，付钱之后可以播放。
