0.刪除用戶邏輯

1）前端邏輯

（1）用戶在頁面列表中，點擊“刪除”按鈕；
（2）點擊后，觸發刪除事件，然后調用src/module/cms/api/cms.js中的page_del接口，此接口向后端發送刪除請求。

2）后端邏輯

（1）后端Dao層使用 Spring Data提供的deleteById方法完成刪除操作

1.刪除頁面接口定義

文件位置：Api項目下的com/ xuecheng/ api/ cms/ CmsPageControllerApi

@ApiOperation("通過ID刪除頁面")
public ResponseResult delete(String id);

2.后端開發–Dao

文件位置：com/ xuecheng/ manage_cms/ dao/ CmsPageRepository

使用 Spring Data提供的deleteById方法完成刪除操作

3.后端開發–Service

文件位置：com/ xuecheng/ manage_cms/ service/ PageService

    //根據id刪除頁面public ResponseResult delete(String id){//先查詢一下Optional<CmsPage> optional = cmsPageRepository.findById(id);if(optional.isPresent()){cmsPageRepository.deleteById(id);return new ResponseResult(CommonCode.SUCCESS);}return new ResponseResult(CommonCode.FAIL);}

4.后端開發–controller

文件位置：com/ xuecheng/ manage_cms/ controller/ CmsPageController

    @Override@DeleteMapping("/del/{id}")public ResponseResult delete(@PathVariable("id") String id) {return pageService.delete(id);}

5.前端開發–page_list.vue添加刪除按鈕

文件位置：src/ module/ cms/ page/ page_list.vue

      <el-table-column label="操作" width="80"><template slot-scope="page"><el-buttonsize="small"type="text"@click="edit(page.row.pageId)">編輯</el-button><el-buttonsize="small"type="text"@click="del(page.row.pageId)">刪除</el-button></template></el-table-column>

6.前端開發–page_list.vue編寫刪除事件

文件位置：src/ module/ cms/ page/ page_list.vue

      del:function (pageId) {this.$confirm('您確認刪除嗎?', '提示', { }).then(() => {//調用服務端接口cmsApi.page_del(pageId).then(res=>{if(res.success){this.$message.success("刪除成功")//刷新頁面this.query()}else{this.$message.error("刪除失敗")}})})}

7.后端開發–Api方法定義Api方法

文件位置：src/ module/ cms/ api/ cms.js

//刪除頁面
export const page_del= (id) =>{return http.requestDelete(apiUrl+'/cms/page/del/'+id)
}