参考本章设定的原型 ![](https://img.kancloud.cn/17/0c/170cf582303bb686f0061f5e2e97c953_1007x646.png) 和一般的编辑组件相同,想成功的实现对某个学生进行编辑,则需要在编辑前调用后台相关接口获取其详细信息,在编辑后再次获取后台的相关的接口,进行学生信息的更新操作。在本节中,预实现以下功能。 * [ ] 获取要编辑的学生,并成功的将数据绑定到组件的V层 * [ ] 根据获取到的学生的班级信息,成功在班级选择组件中选中某个班级 * [ ] 给出一种更简单可靠易用的测试宿主中的组件的方法 * [ ] 前台增加表单验证器,当用户输入不符合规则时进行提示 # 预期效果 ![](https://img.kancloud.cn/3b/e5/3be5ca5ca48266b97df8349124ca51c8_1277x270.gif) # 接口规范 本节中将使用两个接口:根据ID获取某个学生的信息、根据ID更新某个学生的信息。有了前面编辑班级的经验,这两个接口规范在定义起来便显得简单了。 在学习阶段的我们可能无法一下定义出合适的接口(事实上已经有了10几年开发经验的笔者也会在定义接口时出现各种错误),这个非常正常的。定义接口的水平会随着项目经验的积累,踩坑数的增加而逐步增加。 ## 获取学生 在编辑某个学生以前,我们首页要向用户展示当前编辑的学生信息,而这些信息则需要由后台获取: ``` GET /Student/{id} ``` ##### 参数 Parameters | type | name | Description | Schema | | --- | --- | --- | --- | | **param** | **id** <br> *requried* | Long | ### 修改某个学生接口 学生被用户修改后,我们还需要把修改后的数据对应发送给后台: ``` PUT /Student/{id} ``` #### 参数 Parameters | type | name | Description | Schema | | --- | --- | --- | --- | | **param** | **id** <br> *requried* | 这生ID | Long | | **Body** | **班级** <br> *requried* | 学生信息 | Klass | ##### 学生信息 | name | type | description | |--- | --- | --- | | name <br> *requried* | string(2-20) | 学生名称 | | sno <br> *requried unique* | string(6) | 学号 | | klass <br> *requried* | {id: Long} | 班级 | #### 响应(返回值)Responses | HTTP Code | Description | Schema | | --- | --- | --- | | **204** | No Content | |