前端-医院设置信息修改

2、在list.vue页面添加修改按钮

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

编辑

其中路由跳转地址 “’/hospSet/edit/’+scope.row.id” 由index.js的路由路径组成。即点击了列表页的修改按钮后，也买你会跳转到隐藏路由—新增页面。

3、在hospital.js中编写方法调用后端接口

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

首先根据id查询医院设置信息；

在对医院信息做修改。

//根据id获取医院设置信息

getHospitalSet(id){

return request({

url: /admin/hosp/hospitalSet/getHospSet/${id},

method: ‘get’

})

},

//医院设置信息修改

updateHospitalSet(hospitalSet){

return request({

url: /admin/hosp/hospitalSet/updateHospitalSet,

method: ‘post’,

data: hospitalSet

})

}

4、编写js代码

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

4.1、点击编辑，跳转到编辑页面，并进行数据回显的js代码

---

用户点击了编辑按钮后，路由会带上要修改的医院的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

//调用接口得到医院设置信息

this.getHostSet(id)

}

},

methods: {

//根据id查询的方法

getHostSet(id){

hospset.getHospitalSet(id)//调用js中根据id查询医院信息的方法

.then(response =>{

this.hospitalSet = response.data//将查询的信息赋值给hospitalSet对象，并在页面回显数据

})

},

4.2、在编辑页面修改数据，并保存

---

在add.vue页面定义三个方法，一个是添加，一个是修改，这两个方法执行时会调用hospital.js中对应的后端接口方法。

//根据id查询的方法

getHostSet(id){

hospset.getHospitalSet(id)//调用js中根据id查询医院信息的方法

.then(response =>{

this.hospitalSet = response.data//将查询的信息赋值给hospitalSet对象，并在页面回显数据

})

},

//添加方法

save(){

hospset.saveHospitalSet(this.hospitalSet)

.then(response=>{

//提示

this.$message({

type: ‘success’,

message: ‘添加成功!’

最后

由于篇幅限制，pdf文档的详解资料太全面，细节内容实在太多啦，所以只把部分知识点截图出来粗略的介绍，每个小节点里面都有更细化的内容！

,

message: ‘添加成功!’

最后

由于篇幅限制，pdf文档的详解资料太全面，细节内容实在太多啦，所以只把部分知识点截图出来粗略的介绍，每个小节点里面都有更细化的内容！

[外链图片转存中…(img-h8ZMoDqu-1720120840178)]

[外链图片转存中…(img-eDN7eA4M-1720120840180)]