Day05-讲师列表前端-讲师信息修改

2、点击修改按钮，进入表单页面，进行数据回显

=====================================================================================

根据讲师id查询数据显示

3、通过路由跳转进入数据回显页面

===============================================================================

在路由index.js页面添加路由

添加路由：

代码：

{

path: ‘edit/:id’,

name: ‘编辑讲师’,

component: () => import(‘@/views/edu/teacher/save’),

meta: { title: ‘编辑讲师’, noCache: true },

hidden:true//隐藏路由

}

4、在前端页面list.vue的修改按钮处绑定跳转路由

==========================================================================================

5、在表单页面实现数据回显

============================================================================

（1）在teacher.js定义根据id查询数据的接口

==========================================================================================

//根据id查询讲师信息

getTeacherInfo(id){

return request({

url:/eduservice/teacher/getTeacherById/${id},

method:‘post’

})

},

（2）在页面调用接口实现数据回显

===============================================================================

//根据id查询讲师信息的方法

getInfo(id){

teacherApi.getTeacherInfo(id)

.then(response=>{

this.teacher = response.data.teacher

})

},

（3）调用根据id查询的方法

=============================================================================

因为添加和修改都使用save()页面

区别添加还是修改，只有修改时候查询数据回显

判断路径里面是否有讲师id值，如果有id值修改，没有id值直接添加

created(){//页面渲染之前执行

//判断路径是否有id值

if(this.KaTeX parse error: Expected 'EOF', got '&' at position 14: route.params &̲& this.route.params.id){

//从路径获取id值

const id = this.$route.params.id

//调用根据id查询的方法

this.getInfo(id)

}

},

6、数据回显后，修改讲师信息

=============================================================================

（1）在api的teacher.js定义修改接口

=======================================================================================

//修改讲师信息

updateTeacherInfo(teacher){

return request({

url:/eduservice/teacher/updateTeacher,

method:‘post’,

data:teacher

})

}

（2）在页面调用修改的方法

============================================================================

//判断是修改还是添加的方法

saveOrUpdate() {

//判断修改还是添加

//根据teacher是否有id进行判断

if(!this.teacher.id){

//调用添加

this.saveTeacher()

}else{

//修改