增删改批量操作

最新推荐文章于 2024-08-21 22:17:11 发布
最新推荐文章于 2024-08-21 22:17:11 发布
阅读量214 收藏 1
点赞数 2
文章标签： vue.js elementui javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_73461414/article/details/136070104
版权

双击可触发input框模式，可修改当前单元格内容，点击其他地方失去焦点input状态隐藏

修改过的行背景色变红，点击保存则取消背景色

 

 单页面所有代码假数据测试看效果版：

<template>
  <div class="custom-tree-table">
    <el-button style="margin: 2px 0;" size="mini" type="primary" @click="onAdd">+ 新增</el-button>
    <el-button style="margin: 2px 0 0 10px;" size="mini" type="success" @click="onBatchSave">保存</el-button>
    <el-button style="margin: 2px 0 0 10px;" size="mini" type="danger" @click="onBatchDelete" class="el-icon-delete"> 批量删除</el-button>
      <el-table
        :data="currentPageData"
        row-key="id"
        border
        default-expand-all
        height="508"
        :row-style="rowStyle"
        @selection-change="onSelectionChange">
        <!-- 复选框 -->
        <el-table-column width="62" align="center" type="selection" label="选择" />
        <!-- 参数ID -->
        <el-table-column label="参数ID" prop="key" min-width="250">
          <template #default="{ row }">
            <el-input 
              :value="row.key" 
              @click="onEdit(row, 'key')"
              @blur="onBlur(row, 'key')"
              v-if="row.isEditKey || row.key === ''"
              v-model="row.key" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'key')">{{ row.key }}</span>
          </template>
        </el-table-column>
        <!-- 参数名称 -->
        <el-table-column label="参数名称" prop="type" min-width="200">
          <template #default="{ row }">
            <el-input 
              :value="row.type" 
              @click="onEdit(row, 'type')"
              @blur="onBlur(row, 'type')"
              v-if="row.isEditType || row.type === ''"
              v-model="row.type" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'type')">{{ row.type }}</span>
          </template>
        </el-table-column>
        <!-- 参数描述 -->
        <el-table-column label="参数描述" prop="description" min-width="220">
          <template #default="{ row }">
            <el-input 
              :value="row.description" 
              @click="onEdit(row, 'description')"
              @blur="onBlur(row, 'description')"
              v-if="row.isEditDescription || row.description === ''"
              v-model="row.description" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'description')">{{ row.description }}</span>
          </template>
        </el-table-column>
      </el-table>
    <!-- 分页 -->
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page.sync="currentPage"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="pageSize"
      :total="totalDataCount"
      layout="total, sizes, prev, pager, next, jumper"/>
  </div>
</template>

<script>
import axios from 'axios';
export default {
  data() {
    return {
      tableData: [
        { id: '1', key: 'ufnak', type: '按钮', description: 'Name of the person', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '2', key: 'fbunkjn', type: '按钮2', description: 'Age of the person', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '3', key: 'fain', type: '安牛3', description: 'Active status', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '4', key: 'key4', type: 'Type 4', description: 'Description 4', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '5', key: 'key5', type: 'Type 5', description: 'Description 5', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '6', key: 'key6', type: 'Type 6', description: 'Description 6', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '7', key: 'key7', type: 'Type 7', description: 'Description 7', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '8', key: 'key8', type: 'Type 8', description: 'Description 8', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '9', key: 'key9', type: 'Type 9', description: 'Description 9', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '10', key: 'key10', type: 'Type 10', description: 'Description 10', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '11', key: 'key11', type: 'Type 11', description: 'Description 11', isEditKey: false, isEditType: false, isEditDescription: false },
        { id: '12', key: 'key12', type: 'Type 12', description: 'Description 12', isEditKey: false, isEditType: false, isEditDescription: false },
      ],
      selectedRows: [], // 复选框
      modifiedRows: [], // 已经被修改的行的id/背景色
      // 分页
      currentPage: 1, // 前往当前页
      pageSize: 10, // 每页显示多少条
      originalValue: '', //一个变量用于记录编辑前的值
    }
  },
  computed: {
    totalDataCount() { // 计算总数据量
      return this.tableData.length;
    },
    currentPageData() { // 基于分页计算当前页面数据
      const startIndex = (this.currentPage - 1) * this.pageSize;
      const endIndex = startIndex + this.pageSize;
      return this.tableData.slice(startIndex, endIndex);
    },
  },
  methods: {
    // +新增
    onAdd() {
      const id = String(Date.now());
      const newRecord = { id, key: '', type: '', description: '', isEditKey: true, isEditType: true, isEditDescription: true };
      this.tableData.unshift(newRecord);
    },
    // 批量删除
    onBatchDelete() {
      if (this.selectedRows.length > 0) {
        this.tableData = this.tableData.filter(item => !this.selectedRows.some(row => row.id === item.id));
        this.selectedRows = []; // 清空选中的行
      }
    },
    onSelectionChange(selection) { // 复选框选择变更时触发，批量删除
      this.selectedRows = selection;
    },
    // 保存
    onBatchSave() {
      // 收集表格中所有数据
      const allData = this.tableData;
      // 发送数据给后端
      axios.post('/your-backend-endpoint', allData)
        .then(response => {
          // 处理后端返回的响应
          console.log(response.data);
        })
        .catch(error => {
          // 处理错误
          console.error('Error:', error);
        });
      // 清空已修改的行数组
      this.modifiedRows = [];
    },
   // 点击单元格进入编辑状态
   onEdit(row, field) {
      // 在进入编辑状态时记录编辑前的值
      this.originalValue = row[field];
      if (field === 'key') {
        row.isEditKey = true; // 参数ID
        row.isEditType = false; // 参数名称
        row.isEditDescription = false; // 参数描述
      } else if (field === 'type') {
        row.isEditKey = false;
        row.isEditType = true;
        row.isEditDescription = false;
      } else if (field === 'description') {
        row.isEditKey = false;
        row.isEditType = false;
        row.isEditDescription = true;
      }
    },
    // 根据编辑状态设置行样式
    rowStyle({ row }) {
      return { backgroundColor: this.modifiedRows.includes(row.id) ? '#ffcccc' : '' };
    },
    // 失去焦点时触发，隐藏输入框
    onBlur(row, field) {
      if (this.originalValue !== row[field]) {
        // 只有在值发生变化时才将当前行的 ID 添加到 modifiedRows 数组中
        if (!this.modifiedRows.includes(row.id)) {
          this.modifiedRows.push(row.id);
        }
      }
      //
      if (field === 'key') {
        row.isEditKey = false;
      } else if (field === 'type') {
        row.isEditType = false;
      } else if (field === 'description') {
        row.isEditDescription = false;
      }
      // 如果有已修改的行，并且当前行不在已修改的行中，则隐藏已修改的行的编辑状态
      this.tableData.forEach(item => {
        if (this.modifiedRows.includes(item.id) && item.id !== row.id) {
          item.isEditKey = false;
          item.isEditType = false;
          item.isEditDescription = false;
        }
      });
    },
    // 分页每页多少条
    handleSizeChange(val) {
      this.pageSize = val;
    },
    // 前往当前页
    handleCurrentChange(val) {
      this.currentPage = val;
    },
  }
}
</script>

<style scoped>
.custom-tree-table {
  height: 100%;
  background-color: #fff;
  padding: 15px;
}
/*新增按钮宽高*/
.el-button--mini{
  padding: 7px 12px;
}
/*表格每行高度*/
.custom-tree-table /deep/ .el-table__cell {
  padding: 8px;
}
/* input高度 */
::v-deep .el-input__inner{
  height: 26px
}
/* 分页器位置 */
::v-deep .el-pagination{
  display: flex;
  justify-content: flex-end;
}

/* 设置按钮颜色 */
.el-button--primary {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
.el-button--success {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
.el-button--danger {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
</style>

 单页面代码数据改成接口渲染联动版：

<template>
  <div class="custom-tree-table">
    <el-button style="margin: 2px 0;" size="mini" type="primary" @click="onAdd">+ 新增</el-button>
    <el-button style="margin: 2px 0 0 10px;" size="mini" type="success" @click="onBatchSave">保存</el-button>
    <el-button style="margin: 2px 0 0 10px;" size="mini" type="danger" @click="onBatchDelete" class="el-icon-delete"> 批量删除</el-button>
      <el-table
        :data="currentPageData"
        row-key="id"
        border
        default-expand-all
        height="508"
        :row-style="rowStyle"
        @selection-change="onSelectionChange">
        <!-- 复选框 -->
        <el-table-column width="62" align="center" type="selection" label="选择" />
        <!-- 参数ID -->
        <el-table-column label="参数ID" prop="key" min-width="250">
          <template #default="{ row }">
            <el-input 
              :value="row.key" 
              @click="onEdit(row, 'key')"
              @blur="onBlur(row, 'key')"
              v-if="row.isEditKey || row.key === ''"
              v-model="row.key" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'key')">{{ row.key }}</span>
          </template>
        </el-table-column>
        <!-- 参数名称 -->
        <el-table-column label="参数名称" prop="type" min-width="200">
          <template #default="{ row }">
            <el-input 
              :value="row.type" 
              @click="onEdit(row, 'type')"
              @blur="onBlur(row, 'type')"
              v-if="row.isEditType || row.type === ''"
              v-model="row.type" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'type')">{{ row.type }}</span>
          </template>
        </el-table-column>
        <!-- 参数描述 -->
        <el-table-column label="参数描述" prop="description" min-width="220">
          <template #default="{ row }">
            <el-input 
              :value="row.description" 
              @click="onEdit(row, 'description')"
              @blur="onBlur(row, 'description')"
              v-if="row.isEditDescription || row.description === ''"
              v-model="row.description" 
              placeholder="请输入"/>
            <span v-else @click="onEdit(row, 'description')">{{ row.description }}</span>
          </template>
        </el-table-column>
      </el-table>
    <!-- 分页 -->
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page.sync="currentPage"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="pageSize"
      :total="totalDataCount"
      layout="total, sizes, prev, pager, next, jumper"/>
  </div>
</template>

<script>
import axios from 'axios';
export default {
  data() {
    return {
      tableData: [],
      selectedRows: [], // 复选框
      modifiedRows: [], // 已经被修改的行的id/背景色
      // 分页
      currentPage: 1, // 前往当前页
      pageSize: 10, // 每页显示多少条
      originalValue: '', //一个变量用于记录编辑前的值
    }
  },
  computed: {
    totalDataCount() { // 计算总数据量
      return this.tableData.length;
    },
    currentPageData() { // 基于分页计算当前页面数据
      const startIndex = (this.currentPage - 1) * this.pageSize;
      const endIndex = startIndex + this.pageSize;
      return this.tableData.slice(startIndex, endIndex);
    },
  },
  created() {
    this.fetchData();
  },
  methods: {
    // 获取数据后端数据表格
    async fetchData() {
      try {
        // 调用后端获取数据的接口
        const response = await axios.get('/api/getData');
        // 将返回的数据赋值给tableData
        this.tableData = response.data;
      } catch (error) {
        console.error('Error fetching data:', error);
      }
    },
    // +新增
    async onAdd() {
        try {
          // 调用后端新增数据的接口
          const response = await axios.post('/api/addData', { key: '', type: '', description: '', isEditKey: true, isEditType: true, isEditDescription: true});
          // 将返回的新数据插入到表格的最前面
          const newRecord = response.data;
          this.tableData.unshift(newRecord);
        } catch (error) {
          console.error('新增数据时发生错误:', error);
        }
    },
    // 批量删除
    async onBatchDelete() {
      if (this.selectedRows.length > 0) {
        try {
          // 获取选中行的id数组
          const selectedIds = this.selectedRows.map(row => row.id);
          // 调用后端删除数据的接口
          await axios.delete('/api/deleteData', { data: { ids: selectedIds } });
          // 从tableData中移除选中的行
          this.tableData = this.tableData.filter(item => !selectedIds.includes(item.id));
          // 清空选中的行
          this.selectedRows = [];
        } catch (error) {
          console.error('批量删除时发生错误:', error);
        }
      }
    },
    onSelectionChange(selection) { // 复选框选择变更时触发，批量删除
      this.selectedRows = selection;
    },
    // 保存
    async onBatchSave() {
      try {
        // 收集表格中所有数据
        const allData = this.tableData;
        // 发送数据给后端
        const response = await axios.post('/your-backend-endpoint', allData);
        // 处理后端返回的响应
        console.log(response.data);
        // 清空已修改的行数组
        this.modifiedRows = [];
      } catch (error) {
        // 处理错误
        console.error('保存时发生错误:', error);
      }
    },
   // 点击单元格进入编辑状态
   onEdit(row, field) {
      // 在进入编辑状态时记录编辑前的值
      this.originalValue = row[field];
      if (field === 'key') {
        row.isEditKey = true; // 参数ID
        row.isEditType = false; // 参数名称
        row.isEditDescription = false; // 参数描述
      } else if (field === 'type') {
        row.isEditKey = false;
        row.isEditType = true;
        row.isEditDescription = false;
      } else if (field === 'description') {
        row.isEditKey = false;
        row.isEditType = false;
        row.isEditDescription = true;
      }
    },
    // 根据编辑状态设置行样式
    rowStyle({ row }) {
      return { backgroundColor: this.modifiedRows.includes(row.id) ? '#ffcccc' : '' };
    },
    // 失去焦点时触发，隐藏输入框
    onBlur(row, field) {
      if (this.originalValue !== row[field]) {
        // 只有在值发生变化时才将当前行的 ID 添加到 modifiedRows 数组中
        if (!this.modifiedRows.includes(row.id)) {
          this.modifiedRows.push(row.id);
        }
      }
      //
      if (field === 'key') {
        row.isEditKey = false;
      } else if (field === 'type') {
        row.isEditType = false;
      } else if (field === 'description') {
        row.isEditDescription = false;
      }
      // 如果有已修改的行，并且当前行不在已修改的行中，则隐藏已修改的行的编辑状态
      this.tableData.forEach(item => {
        if (this.modifiedRows.includes(item.id) && item.id !== row.id) {
          item.isEditKey = false;
          item.isEditType = false;
          item.isEditDescription = false;
        }
      });
    },
    // 分页每页多少条
    handleSizeChange(val) {
      this.pageSize = val;
    },
    // 前往当前页
    handleCurrentChange(val) {
      this.currentPage = val;
    },
  }
}
</script>

<style scoped>
.custom-tree-table {
  height: 100%;
  background-color: #fff;
  padding: 15px;
}
/*新增按钮宽高*/
.el-button--mini{
  padding: 7px 12px;
}
/*表格每行高度*/
.custom-tree-table /deep/ .el-table__cell {
  padding: 8px;
}
/* input高度 */
::v-deep .el-input__inner{
  height: 26px
}
/* 分页器位置 */
::v-deep .el-pagination{
  display: flex;
  justify-content: flex-end;
}

/* 设置按钮颜色 */
.el-button--primary {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
.el-button--success {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
.el-button--danger {
  background-color: #7184FF;
  border-color: #7184FF;
  color: #fff;
}
</style>

 

 

 

this.一业大可
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
ME_DIRECT_INPUT_INFORECORD 信息记录批量修改程序
阿土工作室
10-10 8790
DATA: l_activity TYPE c. *  IF r1 = 'X'. *    l_activity = 'H'. *  ELSE. *    l_activity = 'V'. *  ENDIF.   LOOP AT it_tab INTO st_tab. **供应商主数据加前导零     CALL FUNCTION 'CONVERSION_EXIT_AL
实验训练3 数据增删改操作
10-26
本实验的主要目的是通过实践操作，掌握 MySQL 中的数据增删改操作，包括单记录插入、批量插入、删除、修改等操作。实验内容包括三个部分：插入数据、删除数据和修改数据。 实验 3-1 插入数据 在本实验中，我们将...
input 批量修改
weixin_30636089的博客
04-21 242
$(function () { $(".jctxtcount").bind("input propertychange", function () { if ($('#jccheck').attr('checked')) { $(".jctxtcount").val($(this).val()); ...
Mybatis的批量增、删、改
JAVA_猿
04-23 178
Mybatis是一个ORM框架，所以数据库的cud那是必须必的问题。so，涉及到一个性能问题。    看到有人在使用mybatis批量删除批量添加的时候还在程序中使用for循环来调用方法，这样是没错，但是性能稍微低一点，所以下面看几个批量处理的例子，相对直接在程序中for循环的效率要高一点：    1）批量添加：    2）批量修改：    3）批量删除：    这种批量的cud比for循环快的原...
java 批量增删改_mybatis 批量处理更新(增删改)操作
weixin_31162865的博客
03-05 692
进行处理操作的时候，又可能进行批量操作的时候,有可能产生错误,原因是因为有些数据库默认允许传递的数据量是有限制的,mysql默认是1M,如果是这种情况,需要在mysql的配置文件(my.ini)中的mysqld这个组里面添加max_allowed_packet=10M我们先来看下批量增加操作:当然我这里只是说明在mapper映射文件的配置，至于dao层就要简单的多：mapper.xmlinsert...
java 批量增删改_java使用JDBC连接mysql并且进行批量增删改操作
weixin_34675395的博客
02-16 522
在处理百万级的数据时，经常需要对数据库中的数据进行增删改查操作，由于数据量大，进行Query的时候在效率上还是可以接受，但进行增删改的时候，如果采用一次一条记录操作，则效率大大的降低，因此，需要进行批量操作。本文利用java在eclipse环境下连接mysql数据库进行批量操作。操作原理很简单，主要利用Betch函数，进行批量操作。Connection conn = DriverManager.g...
java 批量增删改_MyBatis批量增删改查操作
weixin_32364911的博客
02-24 264
批量增加操作步骤1. 在接口UserMapper中添加批量增加方法。/*** 批量增加操作* @param users*/public void batchInsertUsers(List users);2．在User.xml中添加批量增加操作的配置。insert into mhc_user(userName,password) values(#{item.userName},#{item.pas...
mybatis 批量操作 增删改
weixin_45340273的博客
09-23 65
mybatis的增删改操作
2301_77007146的博客
04-25 543
openSession(): 默认开启事务，进行增删改操作后需要用sqlSession.commit();openSession(true): 可以设置为自动提交事务。1. 编写接口方法：Mapper接口。参数：除了id之外的所有数据。注意：Mybatis事务。返回结果使用void。2. 编写sql语句。
批量增删改
qq_40278997的博客
07-10 180
一、最简单的for循环（不推荐，数据量小可以接受） 二、sql，如果是in的这种都可以用sql去解决 <delete id="batchDeleteAmrtIr"> DELETE FROM TTRD_ACCTG_SECU_OBJ_RECILE <where> <if test="ids != null and ids.size() != 0 "> AND ID IN <foreach collec
详解mysql数据库增删改操作
09-09
本文将深入探讨在MySQL中执行增删改（CRUD）操作的基本方法，这些操作是数据库管理的基础。 ### 插入数据 (INSERT) 在MySQL中，插入数据到表中通常使用`INSERT INTO`语句。例如，要向名为`user`的表中插入一条记录...
实验训练3数据增删改操作.docx
06-30
此外，还需使用带Select的Insert语句进行批量插入，这通常用于将一个查询的结果插入到另一张表中，以实现数据的快速复制或合并。 2. **删除数据 (Delete)** 删除数据涉及移除表中的一条或多条记录。实验中使用...
国家开放大学 MySQL数据库应用 实验训练3 数据增删改操作
06-05
MySQL数据库应用实验训练3 数据增删改操作 MySQL数据库应用实验训练3 数据增删改操作是国家开放大学提供的实验训练，旨在让学生熟悉 MySQL 数据库的基本操作，包括数据的增删改操作。实验中，学生将学习使用 Insert...
实现el-table 两列多选框且不可同时勾选，可单选，可多选
weixin_52740695的博客
08-21 150
审核通过可批量处理，可单选；审核不通过，单选，但两者不可同时勾选☑️。
avue-crud 自定义搜索项 插槽
qq_31683775的博客
08-20 211
加上 -search 就可以自定义查询项了。
【前端】VUE动态引入组件 通过字符串动态渲染模板 动态生成组件
我是Superman丶的博客
08-19 172
【前端】VUE动态引入组件 通过字符串动态渲染模板。
Vue 生命周期详解含demo、面试常问问题案例
qq_34419312的博客
08-16 1216
Vue 生命周期详解、面试常问问题案例 含 demo
Vue动态设置背景颜色
最新发布
m0_45306991的博客
08-21 220
的类名，并给他设定一个白色的背景颜色。然后，在Vue模版中，通过使用v-bind指令将“active”类名绑定到元素上，这样就能实现动态绑定的背景颜色。当isActive为false时，“active”类名将不会被应用，背景颜色还原为默认颜色。:style***后面的值是一个JavaScript对象，对象的属性名是CSS属性名，属性值是对应的CSS属性值。可以使用Vue的动态绑定语法来设置元素的样式。一种方案是使用类名的方式动态绑定背景颜色。在上述代码中，使用Vue的动态绑定语法***:style。
gin框架，批量增删改
05-30
在 gin 框架中，批量增删改操作可以通过 HTTP POST 请求来实现，请求的 body 中包含操作类型和数据，服务器端根据操作类型执行对应的增删改操作。以下是一个示例代码，实现批量增删改用户的功能： ```go type User struct { ID int `json:"id"` Name string `json:"name"` Age int `json:"age"` } var users = []User{ {ID: 1, Name: "Alice", Age: 20}, {ID: 2, Name: "Bob", Age: 25}, {ID: 3, Name: "Charlie", Age: 30}, } type BatchRequest struct { Op string `json:"op"` // 操作类型，可以是 add, update 或 delete Users []User `json:"users"` // 待操作的用户列表 } func main() { r := gin.Default() r.POST("/batch", func(c *gin.Context) { var batchReq BatchRequest if err := c.BindJSON(&batchReq); err != nil { c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()}) return } switch batchReq.Op { case "add": for _, user := range batchReq.Users { users = append(users, user) } case "update": for _, user := range batchReq.Users { for i := range users { if users[i].ID == user.ID { users[i] = user break } } } case "delete": ids := make(map[int]bool) for _, user := range batchReq.Users { ids[user.ID] = true } newUsers := make([]User, 0, len(users)) for _, user := range users { if !ids[user.ID] { newUsers = append(newUsers, user) } } users = newUsers default: c.JSON(http.StatusBadRequest, gin.H{"error": "invalid operation type"}) return } c.JSON(http.StatusOK, gin.H{"message": "success"}) }) r.Run(":8080") } ``` 在上述代码中，我们定义了一个 `User` 结构体，包含用户的 ID、姓名和年龄。我们使用一个全局变量 `users` 来保存所有用户的信息。在路由处理函数中，我们首先解析 HTTP 请求中的 JSON 数据，然后根据 `BatchRequest.Op` 的值执行对应的增删改操作。具体来说： - 如果 `Op` 是 `"add"`，就将请求中的所有用户添加到 `users` 中； - 如果 `Op` 是 `"update"`，就将请求中的所有用户的信息更新到 `users` 中； - 如果 `Op` 是 `"delete"`，就将请求中的所有用户从 `users` 中删除。 最后，我们返回一个 JSON 响应，表示操作成功。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值