1、在index.js中添加删除点击事件

 1.1、common.js

function $(key){
    if(key){
        if(key.startsWith("#")){
            key = key.substring(1)
            return document.getElementById(key)
        }else{
            let nodeList = document.getElementsByName(key)
            return Array.from(nodeList)
        }
    }
}

window.onload=function(){
    loadData();
}
loadData=function(){
    axios({
        method:'get',
        url:'/index'
    }).then(response=>{
        debugger
        let fruitList = response.data.data
        // 此处使用的是axios，那么响应回来的数据自动就是json，
        // 不需要再进行parse(如果是原始的ajax操作，那么一定需要parse)
        // let fruitArr = JSON.parse(fruitList)
        let fruitArr = fruitList
        for(let i = 0 ; i<fruitArr.length; i++){
            let fruitTbl = $("#fruit_tbl")
            let tr = fruitTbl.insertRow()
            let fnameTD = tr.insertCell()
            let priceTD = tr.insertCell()
            let fcountTD = tr.insertCell()
            let operTD = tr.insertCell()

            let fruit = fruitArr[i]
            //fnameTD.innerText = fruit.fname
            fnameTD.innerHTML = '<a href="edit.html?fid='+fruit.fid+'">'+fruit.fname+'</a>';
            priceTD.innerText = fruit.price
            fcountTD.innerText = fruit.fcount
            operTD.innerHTML="<img class=\"delImg\" src=\"imgs/del.png\" onclick=\"delFruit("+fruit.fid+")\"/>"
        }
    })
}

delFruit = function (fid) {
    if (window.confirm('是否确认删除？')) {
        axios({
            method: 'get',
            url: 'del',
            params:{
                fid: fid,
            }
        }).then(response=>{
            if (response.data.flag) {
                window.location.reload();
            }
        });
    }
};

2、在FruitDao接口中添加delFruitByFid方法

package com.csdn.fruit.dao;
import com.csdn.fruit.pojo.Fruit;
import java.util.List;
//dao ：Data Access Object 数据访问对象
//接口设计
public interface FruitDao {

    void addFruit(Fruit fruit);

    void delFruit(String fname);
    //通过 fid 删除 水果库存记录
    void delFruitByFid(Integer fid);

    void updateFruit(Fruit fruit);

    List<Fruit> getFruitList();

    Fruit getFruitByFname(String fname);

    Fruit getFruitByFid(Integer fid);
}

3、在FruitDaoImpl中实现delFruitByFid方法

package com.csdn.fruit.dao.impl;
import com.csdn.fruit.dao.FruitDao;
import com.csdn.fruit.pojo.Fruit;
import com.csdn.mymvc.dao.BaseDao;
import java.util.List;
public class FruitDaoImpl extends BaseDao<Fruit> implements FruitDao {
    @Override
    public void addFruit(Fruit fruit) {
        String sql = "insert into t_fruit values (0,?,?,?,?)";
        super.executeUpdate(sql, fruit.getFname(), fruit.getPrice(), fruit.getFcount(), fruit.getRemark());
    }
    @Override
    public void delFruit(String fname) {
        String sql = "delete from t_fruit where fname=?";
        super.executeUpdate(sql, fname);
    }

    //通过 fid 删除水果库存记录
    @Override
    public void delFruitByFid(Integer fid) {
        super.executeUpdate("delete from t_fruit where fid = ? ", fid);
    }

    //通过 fid 可以修改所有的属性值
    @Override
    public void updateFruit(Fruit fruit) {
        String sql = "update  t_fruit set fname=?,price=?,fcount=?,remark=? where fid = ?";
        super.executeUpdate(sql, fruit.getFname(), fruit.getPrice(), fruit.getFcount(), fruit.getRemark(), fruit.getFid());
    }
    @Override
    public List<Fruit> getFruitList() {
        return super.executeQuery("select * from t_fruit");
    }
    @Override
    public Fruit getFruitByFname(String fname) {
        return load("select * from t_fruit where fname = ?", fname);
    }
    @Override
    public Fruit getFruitByFid(Integer fid) {
        return load("select * from t_fruit where fid=?", fid);
    }
}

4、编辑Controller层DelServlet

package com.csdn.fruit.servlet;
import com.csdn.fruit.dao.FruitDao;
import com.csdn.fruit.dao.impl.FruitDaoImpl;
import com.csdn.fruit.dto.Result;
import com.csdn.fruit.util.ResponseUtil;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/del")
public class DelServlet extends HttpServlet {
    FruitDao fruitDao = new FruitDaoImpl();

    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        Integer fid = Integer.parseInt(req.getParameter("fid"));
        fruitDao.delFruitByFid(fid);
        ResponseUtil.print(resp, Result.OK());
    }
}