当前位置：首页 > news >正文

Element UI框架学习篇(六)

news 文章来源：https://blog.csdn.net/SSS4362/article/details/128989885 2025/1/31 10:38:05

Element UI框架学习篇(六)

1 删除数据

1.1 前台核心函数

1.1.1 elementUI中的消息提示框语法

//①其中type类型和el-button中的type类型是一致的,有info灰色,success绿色,danger红色,warning黄色,primary蓝色
//②message是你所要填写的提示信息
//③建议都用'',因为比双引号打字更快
this.$message({type: 'info',message: '文本内容'
});

1.1.2 elementUI中的确认框语法

 //confirmButtonText代表确认操作的文本
//cancelButtonText代表取消操作的文本
//type和el-button中的type是一致的,
//个人决定这里用waring或者danger会好些,因为确认框操作都是涉及到数据变更才会触发的,这样会醒目点
this.$confirm('提示信息', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {//异步提交的地址写在这(axios.post方法写的位置)}).catch(() => {//取消操作时的逻辑写这里this.$message({type: 'info',message: '取消某操作的提示'});          });

1.1.3 del方法

 del(t){// t指的是当前行对象(点击删除时)console.log(t);this.$confirm('确定删除员工编号为:'+t.empno+',姓名为'+t.ename+'的员工吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {//异步提交的地址写在这axios.post("http://127.0.0.1:8080/emp/delete/"+t.empno).then(jg=>{if(jg.data==true){//需要再次去查询一次this.find();this.$message({type: 'success',message: '删除成功'});     }else{this.$message({type: 'danger',message: '删除失败'});   }})}).catch(() => {//取消修改时候的处理逻辑写这里this.$message({type: 'info',message: '已取消修改'});          });}

1.1.4 把删除按钮绑定点击事件,并把当前行对象传递过去(因为要告知用户删除的是哪个对象)

  <!-- 需要得到特定行的数据需要把按钮放在template标签里面
具体是通过该标签的slot-scope属性来得到当前行的数据                
-->
<el-button type="danger" @click="del(s.row)">删除</el-button>

1.2 后台核心代码

//删除操作,empno随便取的,是自定义的,但是requestMapping和delete方法中的需要保持一致
@RequestMapping("delete/{empno}")public boolean delete(@PathVariable Integer empno){return  empService.removeById(empno);}

1.3 完整代码

1.3.1 前台部分

a html文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- ①导入文件: 1.1需要导入el相关样式和vue.js文件 ②需要导入element的js文件③导入异步提交的css文件 --><link rel="stylesheet" href="../elementUI/elementUI.min.css"><script src="../js/vue.js"></script><script src="../js/axios.min.js"></script><script src="../elementUI/elementUI.min.js"></script><title></title>
</head>
<body><div id="app"><el-form inline :model="empDTO"><el-form-item label="按照姓名搜索"><!-- 这里一定要写v-model 不然就不能在里面输入值 这个里面的值需要和对象实例中的值保持一致--><el-input v-model="empDTO.name" placeholder="请输入姓名" ></el-input></el-form-item><el-form-item label="按照职位搜索"><el-input v-model="empDTO.zhiwei" placeholder="请输入职位"></el-input></el-form-item><el-form-item><el-button type="primary" @click="find()">搜索</el-button></el-form-item><el-form-item ><el-button type="primary" @click="findAll()">全部搜索</el-button></el-form-item></el-form><!-- ②el-table代表表格  el-table-column代表表格中的每一列:data需要对应vue实例中的对象数组,lable表示每一列列名,prop是保证能填入每一条数据中对象的字段值 --><el-table :data="emps" :cell-style="{'text-align':'center'}":header-cell-style="{'text-align':'center'}" border ><el-table-column label="编号" prop="empno"></el-table-column><el-table-column label="姓名" prop="ename"></el-table-column><el-table-column label="工作" prop="job"></el-table-column><el-table-column label="工资" prop="sal"></el-table-column><el-table-column label="奖金" prop="comm"></el-table-column><el-table-column label="入职日期" prop="hiredate"></el-table-column><el-table-column  label="操作"><!-- slot-scope可以用来得到当前行的数据 里面的值自定义需要得到特定行需要使用template标签--><template slot-scope="s"><el-button type="success" @click="showEmp(s.row.empno)">编辑</el-button><el-button type="danger" @click="del(s.row)">删除</el-button></template></el-table-column> </el-table><!--layout是用于显示分页插件所要展示的部分 total总页码数 sizes每页条数 prev前箭头pager点点点 next后箭头 jumper跳页  --><el-pagination background :total="total" :current-page.sync="current" :page-size.sync="size" @current-change="find()" layout="total,prev, pager, next, jumper">            </el-pagination><!-- visible的条件为true就显示,为false就不显示 --><el-dialog title="编辑员工信息界面" :visible.sync="editStatus" center><!-- 如果相对对话框中的表单居中,直接套上一个center标签即可 --><center><el-form :model="emp" inline label-width="80px"><el-form-item label="编号"><el-input readonly v-model="emp.empno"></el-input>     </el-form-item><el-form-item label="姓名"><el-input v-model="emp.ename"></el-input>     </el-form-item><el-form-item label="入职日期"><el-input v-model="emp.hiredate"></el-input>     </el-form-item><el-form-item label="职位"><el-input v-model="emp.job"></el-input>     </el-form-item><el-form-item label="工资"><el-input v-model="emp.sal"></el-input>     </el-form-item><el-form-item label="奖金"><el-input v-model="emp.comm"></el-input>     </el-form-item><el-form-item><el-button type="success" @click="editEmp()">修改</el-button><el-button type="info" @click="showEmp(emp.empno)">重置</el-button></el-form-item></el-form></center></el-dialog></div><script src="../js/edit.js"></script>
</body>
</html>

b js文件

new Vue({el:"#app",data:{emps:[],current:0,//当前页码数size:0,//每页显示条数total:0,//总条数editStatus:false,//editStatus为false时,只是隐藏该标签,实例并没有取消emp:{empno:null,//员工编号,需要与数据库字段对应ename:null,//员工姓名hiredate:null,//员工入职日期job:null,//员工工作sal:null,//员工薪水comm:null,//员工奖金},//empDTO对象,用于传输数据到后台empDTO:{name:null,zhiwei:null,}},mounted(){//④钩子函数里面调用自定义查询方法 如果要调用本实例的自定义方法,需要使用this.this.find();},methods:{//③创建自定义查询方法,减少冗余,注意:地址里面的find需要加上斜杠//因为加上了自定义条件,所以这里需要传入查询对象过去find(){axios.post("http://127.0.0.1:8080/emp/find/"+this.current,this.empDTO).then(jg=>{//jg.data是后台返回的Ipage对象,其中.records才是对应的数据console.log(jg.data);this.current=jg.data.current;this.size=jg.data.size;this.total=jg.data.total;this.emps=jg.data.records;})},//查询所有方法findAll(){this.empDTO.name=null,this.empDTO.zhiwei=null,//设置全部搜素后回到首页this.current=1;this.find();},showEmp(empid){//带上map集合过去,需要使用{key:value}的形式axios.post("http://localhost:8080/emp/findid",{id:empid}).then(jg=>{this.emp=jg.data;this.editStatus=true;})},editEmp(){this.$confirm('此操作将修改员工信息', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {//第二个参数带{}的是map集合,直接逗号的是后台可以直接接收的 axios.post("http://127.0.0.1:8080/emp/update",this.emp).then(jg=>{if(jg.data==true){this.editStatus=false;  this.$message({type: 'success',message: '修改成功!'});// 方法与方法之间使用this.调用this.find();}else{this.$message({type: 'info',message: '修改失败!'});   }})   }).catch(() => {this.showEmp(this.emp.empno);this.$message({type: 'info',message: '已取消修改'});          });},del(t){// t指的是当前行对象(点击删除时)// alert("进入了方法没有");console.log(t);this.$confirm('确定删除员工编号为:'+t.empno+',姓名为'+t.ename+'的员工吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {//异步提交的地址写在这axios.post("http://127.0.0.1:8080/emp/delete/"+t.empno).then(jg=>{if(jg.data==true){//需要再次去查询一次this.find();this.$message({type: 'success',message: '删除成功'});     }else{this.$message({type: 'danger',message: '删除失败'});   }})}).catch(() => {//取消修改时候的处理逻辑写这里this.showEmp(this.emp.empno);this.$message({type: 'info',message: '已取消修改'});          });}}
})

1.3.2 后台部分

package com.zlz.controller;import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.zlz.dto.EmpDTO;
import com.zlz.entity.Emp;
import com.zlz.service.IEmpService;
import org.springframework.web.bind.annotation.*;
import org.springframework.stereotype.Controller;import javax.annotation.Resource;
import java.util.List;
import java.util.Map;/*** <p>*  前端控制器* </p>** @author zlz* @since 2023-02-10*/
@RestController
@RequestMapping("/emp")
//解决跨域
@CrossOrigin
public class EmpController {//先按照名字,再按照类型@ResourceIEmpService empService;
//    @RequestMapping("find")
//    public List<Emp> find(){
//        return empService.list();
//    }@RequestMapping({"find","find/{page}"})//引用数据类型为空public IPage<Emp> find(@PathVariable(required = false) Integer page, @RequestBody EmpDTO empDTO){//使用mybatis-plus的后端插件System.out.println(page+"当前页码");System.out.println(empDTO);if(page==null) {page = 1;}IPage<Emp> iPage=new Page<>(page,3);//带上条件构造器QueryWrapper<Emp> qw = new QueryWrapper<>();//写的是列名,满足条件就查询,qw默认是andqw.like(empDTO.getName()!=null,"ename",empDTO.getName());//qw.or().like是或者 单元测试里面测试sql语句qw.like(empDTO.getZhiwei()!=null,"job",empDTO.getZhiwei());return empService.page(iPage,qw);}//增删改查用vue的方式也可以,用之前的方式也行@RequestMapping("findid")//json格式的数据public Emp findid(@RequestBody Map<String,Object> map){return  empService.getById(map.get("id").toString());}//修改界面@RequestMapping("update")//json格式的数据接收只能用requestBodypublic boolean update(@RequestBody Emp emp){//try---catch的方式在控制器
//        System.out.println(emp);return  empService.updateById(emp);}//删除操作,empno随便取的,是自定义的,但是requestMapping和delete方法中的需要保持一致@RequestMapping("delete/{empno}")public boolean delete(@PathVariable Integer empno){return  empService.removeById(empno);}
}

1.4 测试

1.4.1 点击修改按钮前

在这里插入图片描述

1.4.2 点击修改按钮后

在这里插入图片描述

1.4.3 点击确定按钮后的界面

在这里插入图片描述

1.4.4 执行删除操作前数据库的数据

在这里插入图片描述

1.4.5 执行删除操作后数据库的数据

在这里插入图片描述

Element UI框架学习篇(六)

Element UI框架学习篇(六) 1 删除数据 1.1 前台核心函数 1.1.1 elementUI中的消息提示框语法 //①其中type类型和el-button中的type类型是一致的,有info灰色,success绿色,danger红色,warning黄色,primary蓝色 //②message是你所要填写的提示信息 //③建议都用,因为比双引号…...

编程日记 2023/2/12 14:18:24

Python如何安装模块，python模块安装失败的原因以及解决办法

前言今天来给刚开始学习python的朋友讲解一下如何安装python模块, python模块安装失败的原因以及解决办法很多朋友拿到代码之后，就开始复制粘贴 --> 然后右键进行运行结果就是报错说没有这个模块得安装啥的 Python模块安装一. 打开命令提示符 win …...

编程日记 2023/2/12 14:17:17

《NFL橄榄球》：洛杉矶闪电·橄榄1号位

洛杉矶闪电（英语：Los Angeles Chargers），又译“洛杉磯衝鋒者”。是一支位于加利福尼亚州洛杉矶郡英格尔伍德的职业美式橄榄球球队，现为美国橄榄球联合会西区成员之一。该队曾于1961年搬迁到圣地亚哥而改叫圣地亚哥电光…...

编程日记 2023/2/12 14:16:10

4.7 Python设置代码格式

随着你编写的程序越来越长，有必要了解一些代码格式设置约定。请花时让你的代码尽可能易于阅读；让代码易于阅读有助于你掌握程序是做什么的,也可以帮助他人理解你编写的代码。为确保所有人编写的代码的结构都大致一致，Python程序员都遵循一些格…...

编程日记 2023/2/12 14:13:59

Zabbix 构建监控告警平台（五）

Zabbix 自动发现Zabbix 自动注册1.Zabbix 自动发现 1.1前言为了满足监控企业成千上万台服务器，因此我们需要使用Zabbix批量监控来实现。自动发现和自动注册。 1.2zabbix-server （一）1、创建自动发现规则在“配置”->“自动发现”->“…...

编程日记 2023/2/12 14:12:53

2023关键词：挑战

未失踪人口回归… 好久不见，不经意间拖更2个多月。今天周末，外面淅淅沥沥下着小雨，这种窝在床上的时刻最适合写点东西了。但是建议大家在办公或者写博客的时候尽量还是端正坐姿，我就是因为喜欢这样靠在床背上，长时间…...

编程日记 2023/2/12 14:11:46

Wifi wpa_supplicant 到驱动的联系

同学，别退出呀，我可是全网最牛逼的 WIFI/BT/GPS/NFC分析博主，我写了上百篇文章，请点击下面了解本专栏，进入本博主主页看看再走呗，一定不会让你后悔的，记得一定要去看主页置顶文章哦。从framework到wpa_supplicant的适配层，其中framework部分需要了注意的是wifiservic…...

编程日记 2023/2/12 14:10:39

【状态估计】基于二进制粒子群优化（BPSO）求解最佳 PMU优化配置研究【IEEE30、39、57、118节点】（Matlab代码实现）

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势：🌞🌞🌞博客内容尽量做到思维缜密，逻辑清晰，为了方便读者。 ⛳️座右铭&a…...

编程日记 2023/2/12 14:09:29

python 将 .pdf 文件转为 .md

环境准备 pip install aspose-words 代码 doc aw.Document(r"pdf 文件路径\xxx.pdf") doc.save("Output.md") 来源：https://products.aspose.com/words/zh/python-net/conversion/...

编程日记 2023/2/12 14:08:20

【C语言】操作符详解

每天一篇博客，卷死各位。文章目录前言1. 算术操作符2. 移位进制位的表示移位操作符1. 》--左移操作符2. 《--右移操作符3.位操作符4.赋值操作符5.单目操作符6.关系操作符7. 逻辑操作符8.条件操作符9.逗号操作符总结前言在c语言学习中操作符尤为重要，而…...

编程日记 2023/2/12 14:07:09

微信小程序学生选课系统--nodejs+vue

系统分为学生和管理员，教师三个角色学生小程序端的主要功能有： 1.用户注册和登陆系统 2.查看选课介绍信息 3.查看查看课程分类 4.查看课程详情，在线选课，提交选课信息 5.在线搜索课程信息 6.用户个人中心修改个人资料 7.用户查看…...

编程日记 2023/2/12 14:06:02

leaflet 加载geojson文件并显示图形（示例代码051）

第051个点击查看专栏目录本示例的目的是介绍演示如何在vue+leaflet中加载geojson文件，将图形显示在地图上。直接复制下面的 vue+openlayers源代码，操作2分钟即可运行实现效果；注意如果OpenStreetMap无法加载，请加载其他来练习文章目录示例效果配置方式示例源代码（…...

编程日记 2023/2/12 14:04:54

【Kafka】ZK和Kafka集群的安装和配置

一、集群环境说明1. 虚拟机：192.168.223.101/103/1052. 系统版本：CentOS 7.93. JDK版本：11.0.18.0.14. Zookeeper版本：3.7.15. Kafka版本：2.13-2.8.2备注：无论是ZK，还是Kafka，都需要…...

编程日记 2023/2/12 14:03:41

并发编程出现的问题以及解决方式

解决并发编程出现的问题基于java内存模式的设计出现的问题基于java内存模式的设计，多线程操作一些共享的数据时，出现以下三个问题：1.不可见性问题：多个线程同时在各自的工作内存对共享数据进行操作，彼此之间不可见。操…...

编程日记 2023/2/12 14:02:34

[ linux ] linux 命令英文全称及解释

🍬 博主介绍 👨‍🎓 博主介绍：大家好，我是 _PowerShell ，很高兴认识大家~✨主攻领域：【渗透领域】【数据通信】【通讯安全】【web安全】【面试分析】🎉点赞➕评论➕收藏养成习…...

编程日记 2023/2/12 14:01:27

C++11新特性

文章目录说在前面花括号{}初始化new的列表初始化STL相关容器的列表初始化相关语法格式容器列表初始化的底层原理forward_list和array与类型相关的新特性decltype左值引用和右值引用什么是左值，什么是右值左值和右值的本质区别右值引用如何理解右值引用std::move移动…...

编程日记 2023/2/12 14:00:20

【宝塔部署SpringBoot前后端不分离项目】含域名访问部署、数据库、反向代理、Nginx等配置

一定要弄懂项目部署的方方面面。当服务器上部署的项目过多时，端口号什么时候该放行、什么时候才会发生冲突？多个项目使用redis怎么防止覆盖？Nginx的配置会不会产生站点冲突？二级域名如何合理配置？空闲的时候要自己用服…...

编程日记 2023/2/12 13:59:13

从0到1一步一步玩转openEuler--11 openEuler基础配置-设置磁盘调度算法

11 openEuler基础配置-设置磁盘调度算法文章目录11 openEuler基础配置-设置磁盘调度算法11.1 设置磁盘调度算法11.1.1 临时修改调度策略11.1.2 永久设置调度策略11.1 设置磁盘调度算法本节介绍如何设置磁盘调度算法。 11.1.1 临时修改调度策略例如将所有IO调度算法修改为…...

编程日记 2023/2/12 13:58:08

河道治理漂浮物识别监测系统 yolov7

河道治理漂浮物识别监测系统通过yolov7网络模型深度视觉分析技术，河道治理漂浮物识别监测算法模型实时检测着河道水面是否存在漂浮物、水浮莲以及生活垃圾等，识别到河道水面存在水藻垃圾等漂浮物，立即抓拍存档预警。You Only Look Once说的是…...

编程日记 2023/2/12 13:56:59

微信小程序 java ssm Springboot学生作业提交管理系统

系统具有良好的集成性，提供标准接口，以实现与其他相关系统的功能和数据集成。开放性好，便于系统的升级维护、以及与各种信息系统进行集成。功能定位充分考虑平台服务对象的需求。一个微信小程序由.js、.json、.wxml、.wxss四种文件构成&…...

编程日记 2023/2/12 13:55:52

实战项目-课程潜在会员用户预测（朴素贝叶斯＆神经网络）

目录1、背景介绍2、朴素贝叶斯2.1 模型介绍2.2 模型实现3、人工神经网络1、背景介绍目标：将根据用户产生的数据对课程潜在的会员用户（可能产生购买会员的行为）进行预测。平台的一位注册用户是否购买会员的行为应该是建立在一定背景条件下…...

编程日记 2023/2/12 13:54:46

ESP32设备驱动-定时器与定时器中断

定时器与定时器中断文章目录定时器与定时器中断1、ESP32定时器介绍2、定时器相关API介绍3、软件准备4、硬件准备3、代码实现有时需要按时发生某些事情，这就是计时器和计时器中断发挥作用的地方。定时器是一种中断。它就像一个简单的时钟，用于测量和控制时间事件，提供精确…...

编程日记 2023/2/12 13:53:41

【JavaScript 逆向】安居客滑块逆向分析

声明本文章中所有内容仅供学习交流，相关链接做了脱敏处理，若有侵权，请联系我立即删除！案例目标验证码：aHR0cHM6Ly93d3cuYW5qdWtlLmNvbS9jYXB0Y2hhLXZlcmlmeS8/Y2FsbGJhY2s9c2hpZWxkJmZyb209YW50aXNwYW0以上均做了脱敏处…...

编程日记 2023/2/12 13:52:34

【STM32】【HAL库】遥控关灯1主机

相关连接【STM32】【HAL库】遥控关灯0 概述【STM32】【HAL库】遥控关灯1主机【STM32】【HAL库】遥控关灯2 分机【STM32】【HAL库】遥控关灯3 遥控器需求主机需要以下功能: 接收来自物联网平台的命令发送RF433信号给从机接收RF433信号和红外信号驱动舵机动作方案设计…...

编程日记 2023/2/12 13:51:27

Java 初始化块

文章目录1、初识初始化块2、实例初始化块和构造器3、类初始化块1、初识初始化块 Java 使用构造器来对单个对象进行初始化操作，使用构造器先完成对整个 Java 对象的状态初始化，然后将 Java 对象返回给程序，从而让该 Java 对象的信息更加完整。…...

编程日记 2023/2/12 13:50:20

超详细讲解长度受限制的字符串函数（保姆级教程！！！）

超详细讲解长度受限制的字符串函数（保姆级教程！！！）长度受限制的字符串函数strncpy函数strncpy函数的使用strncpy函数的模拟实现strncat函数strncat函数的使用strncat函数的模拟实现strncmp函数strncmp函数的使用strncm…...

编程日记 2023/2/12 13:49:15

【c#】c#常用小技巧方法整理（4）——cmd命令提示符，c#调用cmd

CMD命令是一种命令提示符，CMD是command的缩写，位于系统System32的目录下，是大多数Windows操作系统中可用的命令行解释器应用程序。用于执行输入的命令。其中大多数命令通过脚本和批处理文件自动执行任务，执行高级管理功能&#xf…...

编程日记 2023/2/12 13:48:08

在项目中遇到的关于form表单的问题

前言以下内容都是基于element Plus 和 vue3 一个form-item校验两个下拉框有时候不可避免会遇到需要一个form-item校验两个下拉框的情况，比如： 这种情况下传统的校验已经无法实现，需要通过form表单提供的自定义校验来实现。以上面的必填…...

编程日记 2023/2/12 13:47:03

德国奔驰、博世和保时捷的员工年薪有多少？

点击欧盟IT那些事关注我们公告：因企鹅审核规定，本公众号从《德国IT那些事》更名为《欧盟IT那些事》。从职场新人到总裁，一个个盘。位于德国斯图加特的梅赛德斯-奔驰集团及其子公司梅赛德斯-奔驰是世界最知名的汽车制造商之一。奔驰车代表着…...

编程日记 2023/2/12 13:45:57

Mybatis与微服务注册

目录一，Springboot整合MybatisPlus 创建商品微服务子模块二，SpringBoot整合Freeamarker 三、SpringBoot整合微服务 &gateway&nginx 整合微服务之商品服务zmall-product 创建并配置网关gateway服务安装配置SwitchHosts 安装配置Windo…...

编程日记 2023/2/12 13:44:49

凡天网网站建设/百度搜索图片

东莞西南科技XL-LS-E太阳能航标灯采用内置转换效率高达25%的太阳能电池板一体化设计，配合太阳能专用磷酸铁锂电池为电源。控制电路采用微功耗单片机控制芯片，能更精确的控制电池充放电状态，同时也降低了控制电路本身能耗。光源采用特殊定制LE…...

编程日记 2025/1/31 10:25:35

网站空间管理/站长统计网站

恶意网络攻击者对软件供应链的攻击，正向“上游”组件蔓延，再借助开源软件的“信任链”和影响力，导致的结果之一就是破坏性更大。Sonatype 的《2020软件供应链报告》报告提出，下一代软件供应链攻击正在到来，显著特点就是…...

编程日记 2025/1/31 10:07:04

医疗器械外贸网站建设/竞价推广论坛

东阳的学习笔记一、EventLoop::runInLoop() runInLoop：在 IO 线程内执行某个用户任务回调。如果用户在当前 IO 线程调用这个函数，回调会同步进行；如果用户在其他线程调用，cb会被加入队列中，IO 线程会被唤醒来调用这…...

编程日记 2025/1/31 9:29:49

1、下载 Maven ①、官网下载地址：http://maven.apache.org/download.cgi 2、配置 Maven 环境变量 3.3.9 是一个稳定的maven版本，老程序员最喜欢 CLASSPATH .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar JAVA_HOME C:\Program Files\jdk1.8.0_16…...

编程日记 2025/1/31 8:21:17

可视化前端开发工具/一点优化

智慧农业IOT-onenet平台简单介绍 1、onenet平台简介 1.1、 onenet简介 OneNET是由中国移动打造的PaaS物联网开放平台。平台能够帮助开发者轻松实现设备接入与设备连接，快速完成产品开发部署，为智能硬件、智能家居产品提供完善的物联网解决方案。是…...

编程日记 2025/1/31 7:15:52

php网站后台入口/凡科网站建设

为什么用与平台无关,不需要直接调用,而是发消息到mq,解耦\异步架构启动...

编程日记 2025/1/31 5:19:07

Element UI框架学习篇(六)

1 删除数据

1.1 前台核心函数

1.1.1 elementUI中的消息提示框语法

1.1.2 elementUI中的确认框语法

1.1.3 del方法

1.1.4 把删除按钮绑定点击事件,并把当前行对象传递过去(因为要告知用户删除的是哪个对象)

1.2 后台核心代码

1.3 完整代码

1.3.1 前台部分

a html文件

b js文件

1.3.2 后台部分

1.4 测试

1.4.1 点击修改按钮前

1.4.2 点击修改按钮后

1.4.3 点击确定按钮后的界面

1.4.4 执行删除操作前数据库的数据

1.4.5 执行删除操作后数据库的数据

相关文章：