后台的企业网站模板,网站对应的ip,网站建设合同用贴印花税吗,做网站常用工具文章目录0.删除用户逻辑1.删除页面接口定义2.后端开发--Dao3.后端开发--Service4.后端开发--controller5.前端开发--page_list.vue添加删除按钮6.前端开发--page_list.vue编写删除事件7.后端开发--Api方法定义Api方法0.删除用户逻辑
1#xff09;前端逻辑
#xff08;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){//先查询一下OptionalCmsPage 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 OverrideDeleteMapping(/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操作 width80template slot-scopepageel-buttonsizesmalltypetextclickedit(page.row.pageId)编辑/el-buttonel-buttonsizesmalltypetextclickdel(page.row.pageId)删除/el-button/template/el-table-column6.前端开发–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)
}
