开发者学堂课程【微服务+全栈在线教育实战项目演练（SpringCloud Alibaba+SpringBoot）:课程管理-添加课程信息前端(2)】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/667/detail/11370
课程管理-添加课程信息前端(2)
内容介绍
一，编写表单页面，实现借口调用
二，添加之后返回课程 id
一，编写表单页面，实现借口调用
<el-form label -width=" 120px" ,
<el-form-item label-"课程标题"><el-input v-model-" courseInfo. title" placeholder="
示例：机器学习项目课：从基础到搭建项目视频课程。
专业名称注意大小写"/></el- form- item>
<!-- 所属分类TODO --〉
<!--课程讲师TODO --〉
<el-form- item label-" i,iagelnput-tumber :min-"o" v-ol-lcursenfro less controls positioritiplaceholder-"请填写课程的总课时数"/>
</el- form- item>
把这个 yellow phone 部分给他替换掉，换成这个表单。
这个就拿过来了之后，看一下这表单中内容在里边，首先第一个有课程的名称或者课程的标题，然后下面有分类，讲师看到里面还有个课时数，然后有价格等等。
首先点击课程管理，然后点添加课程，他就到这个页面，在页面中目前有这么一个表单，有些基础值，输入一下，比如说第一个输一个课程标题，一个课程名称随便写个这个0302，这是第一个，第二个课时数来个60课时，第四个价格来个两块钱，这样的话把这个数据都填完了，填完之后咱点保存，并下一步看提示单位是成功，同时跳转到第二步，这个过程应该就正确了，到表里面看一下。
描述里面入门课程，这个叫5985没错，再看课程里边那个值。
时间排下去找到这个值，0302这个课程这些都可以，这些只没有做到污染行为，后面都会加上，所以看到这里边的课程的基本信息，就做了一个初步实现。
二，添加之后返回课程 id
@Autowiredprivate EduCourseService courseService://添加课程基本信息的方法@PostMapping ( addCourseInfo' )public R addCourseInfo (eRequestBody CourseInfoVo courseInfoVo)[// 返回添加之后课程id,为J后面添加大纲使用String id = courseService. saveCourseInfo (courseInfoVo) :return R. ok(). data(" courseId", idh.
后面是没有返回值，要加个返回值，返回添加之后的课程 ID，是为了后面添加那个课程的大纲。让他来个返回值，就来一个词汇叫 ID。这个方法就是写，然后下面加上一个返回一下，这个 ID 咱需要完善，然后这个做到之后，把思维中的方法改一下，改这个方法，这个方法返回一个 ID，这是思维的一个 interface。
然后在实现类中把 ID 返回 ID 就是把这个返回就可以，直接就扔一个课程 ID需要返回，这不需要完善，如果不这么做，那后面的章节小结，包括确认没法做，因为它没有快递，不知道要向哪边的内容。
把这个接口完善了之后，来到页面中，页面肯定需要改一下。这个给他重启一下这叫。
然后来到页面中，在页面中其实主要就是改代码。刚才写的时候 response 没有取值，而现在 response 里面，可以把它那个课程 ID取到，然后再做操作。比如就这么想直接找位置，或者外面我这边直接加上一个。
地这就是得到接口返回的快递然后传到这个路由中去。
save0rUpdate() {course . addCourseInfo( this.courseInfo). then(response => {//提示this. $message({type:success' ,message:'添加课程信息成功!'});//跳转到第二步this. $router .push( {path: /course/chapter/ +response .data .courseId})
