黑马javaweb综合案例---删除

流程:用户点击删除(@click = “删除方法”—(发送ajax请求携带被选中的id号))—servlet拿到删除所需要的id号—调用service的删除方法—dao层编写相应的方法以及数据库的删除语句

写代码 从后往前写:

首先编写dao层的方法:

@Delete("delete from tb_brand where id = #{id}")
void delete(int id);

service层编写删除方法(接口添加此方法):

@Override
    public void delete(int id) {
          
   
        SqlSession sqlSession = factory.openSession();
        BrandMapper mapper = sqlSession.getMapper(BrandMapper.class);

        mapper.delete(id);
        sqlSession.commit();
        sqlSession.close();
    }

写servlet:

    前端的id号以url的形式传到后端 前端的id号我们也可以放到前端ajax的data的位置上,以json的形式传到后端

第一种:

public void delete(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
          
   
        String _id = request.getParameter("id");
        int id = Integer.parseInt(_id);

        service.delete(id);
        response.getWriter().write("success");
    }

第二种:

public void delete(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException{
          
   
        BufferedReader reader = request.getReader();
        String _id = reader.readLine();

        Integer id = JSON.parseObject(_id, int.class);
        service.delete(id);
        response.getWriter().write("success");
    }

以上便是后端的

前端就是修修改改:

//第一步
//slot-scope="scope":简单理解带有数据的插槽;	scope.ro:相当于当前行的数据对象
//有兴趣深究的话可以瞅瞅https://blog..net/qyl_0316/article/details/107360542
<el-row  slot-scope="scope">
      <el-button type="primary">修改</el-button>
      <el-button type="danger" @click = "byDelete(scope.row)">删除</el-button>
</el-row>
 //第二步:添加到data()
     //当前选中行的对象
      row:{
          
   },
     //当前选中行的下标
     index:0,
//第三步:做出删除方法:
byDelete(row)
            {
          
   
                //删除的对象的id
               // this.brand.id= row.id;

                //弹出确认删除的提示框
                this.$confirm(此操作将删除该数据, 是否继续?, 提示, {
          
   
                    confirmButtonText: 确定,
                    cancelButtonText: 取消,
                    type: warning
                }).then(()=>{
          
   
                    //用户点击确认按钮
                    //发送ajax请求
                    axios({
          
   
                        method:"get",
                        //url:"http://localhost:8080/brand_case/brand/delete?id="+this.brand.id
                        url:"http://localhost:8080/brand_case/brand/delete?id="+row.id

                    }).then(resp=>{
          
   
                        if(resp.data=="success"){
          
   
                            //表示删除成功
                            //刷新页面
                            //location.reload();
                            //刷新页面,重新查询数据
                            this.selectAll();
                            //弹出消息提示
                            this.$message({
          
   
                                message: 恭喜你,删除成功!,
                                type: success
                            });
                        }
                    })

                }).catch(()=>{
          
   
                    //用户点击取消按钮
                    this.$message({
          
   
                        type: info,
                        message: 已取消删除
                    });
                })
            },
经验分享 程序员 微信小程序 职场和发展