开发者学堂课程【微服务+全栈在线教育实战项目演练（SpringCloud Alibaba+SpringBoot）：首页数据显示-热门课程和名师（前端）】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/667/detail/11433
首页数据显示-热门课程和名师（前端）
现在在 service 中的依赖和配置，就算出现问题也是可以运行的，不会影响运行
1、Nginx 进行访问规则配置
Iocation - educms/{
Proxy-pass http://localhost:6004:
}
完成之后，测试一下，刷新之后，首先有两张图，效果是有的，写完之后可能会有报错，但是是正在加载，加载完成后就没有了。
启动 nginx，看第一部分，就是看图
要把课程和名师在里边遍历出来，和之前的写法是一样的
Import request from "@/utils/request'
export default
//查询热门课程和名师
getIndexDatar (){
Return request
url:/educms/ bannerfront / getA11Banner ',
method:'get'
}
在其中调用一下接口，直接复制即可，就遍历出来了
继续来到页面中调用
//查询热门课程和名师
getHotCourseTeacher (){
index. getIndexData ()
then(response=){
this, edulist=response, data, data, edulist
this, teacherlist=response, data, data, teacherlist
})
每个 li 是一个课程，把其它7个 都删掉，只剩一个，然后将这一个用 v-for 做一个遍历，然后通过 course 在里边取值，
<a href="#"title="开始学习"class="comm-btn-1">开始学习</ a>
</div>
</section>
<h3class=" hLh30txt0fmt10 ">
< a href=" "title="听力口语"class="course title fsize18c . 333">{听力口语}</ a>
alt 显示图片信息接下来才加 title
课程可能是免费或者收费的，那这个的显示，直接看 price 价格，如果价格是0那么就是免费的，不是0就是收费的，看0去判断
</h3>
<section class=" mt10hLh20 of">
(span class"fr jgTagbg-green"v-if="Number(course, price)=="θ">
<i class="c- fff fsize12f -fA">免费</i>
</span>
<span class="fl jgAttrc-cccf-fA">
<i class="c-999f-fA">9634人学习</i>
<i class="c-999f-fA">9634评论</i>
名师的和上边也是一样的
< img alt="谢娜”src=""/assets/photo/teacher/ 1442297919077 . jpg">
</ a>
</div>
<div class="mt10, th30txt0ftac ">
< a href=" "title="谢娜"class="fsize18c-666">谢娜</ a>
</div>
<div class=" hLh30txt0f tac">
<span class="Isize14c-999">资深课程设计专家，专注10年AACTP美国培训协会认证导师</span></div><div
glass="mt15i-q-txt">
<p
Class=“c-999 f-fA
＞十年课程研发和培训咨询经验，曾任国企人力资源经理、大型外企培训经理，负责企业大学和培训体系搭</div>
</section>
div class="i-teach-pic">
< a href="/teacher/1"title-"刘德华">
< img alt="刘德华"src="～/assets/photo/teacher/ 1442297927029 . jpg"
</ a>
</div>
<div class=" mt10hh30txt0f tac">
< a href=" "title="刘德华"class="fsize18c-666">刘德华</ a>
</div>
<div class=" hLh30txt0ftac ">
<span class="fsize14c-999">上海师范大学法学院副教授</span>
</div>
<div class="mt15i-q-txt">
<p
class="c-999f-fA"
>上海师范大学法学院副教授、清华大学法学博士。自2004年至今已有9年的司法考试培训经验。
长期从事司也是取里边其它的值，我们需要做的就是把静态资源改成数据库查询，而以上就可以很好的做到。
名师部分和以上的部分基本相似，也是删掉7个，留一个，根据讲师头像和名字，资历和简介也是用 teacher intor 替代。
先启动服务，查询讲师头像以及其它，必须启动才可以使用，来到首页面，banner 有其它没有，先看接口然后看前端，点 tryitout 里边是没有问题的，可以通过浏览器直接使用，用801数据可以得到。
