Vue3 + ElementPlus动态合并数据相同的单元格（超级详细版）

最近的新项目有个需求需要合并单元列表。ElementPlus 的 Table 提供了合并行或列的方法，可以参考一下https://element-plus.org/zh-CN/component/table.html

但项目中，后台数据返回格式和指定合并是动态且没有规律的，Element 的示例过于简单，因此记录下来，大家可以参考一下！

 效果图

 后台返回的数据结构

代码详解

实操中，需要合并的代码通常就是 list_cnt 数据需要进行合并，因为后台返回的格式都是Data 数据中包裹着 list_cnt 数据，这种格式看起来也是比较清晰。由 Element 文档可知：el-table 组件主要靠 :span-method 方法实现合并。

 完整代码

<template><div class="app-container"><div class="search-bar"><el-form :inline="true" :model="formData" class="common-form-inline"><el-form-item label="名称搜索"><el-input v-model="formData.name" clearable @clear="queryAndroidList(true)" placeholder="请输入" /></el-form-item><el-form-item><el-button type="primary" @click="queryAndroidList(true)">搜索</el-button></el-form-item></el-form></div><el-table :data="list" :stripe="true" fit highlight-current-row :show-overflow-tooltip="true"style="width: 100%; margin-top: 20px" v-loading="loading" @selection-change="handleSelectionChange":span-method="objectSpanMethod" border><el-table-column type="selection" align="center" width="55" /><el-table-column align="center" label="实例" prop="idx" width="220px"><template #default="scope"><el-button size="small" round>实例: {{ scope.row.idx }}</el-button><el-button type="primary" size="small" @click="handleEdit(scope.row)">编辑</el-button><el-button type="primary" size="small" @click="handleCreate(scope.row)">创建</el-button><div class="time-line"><span>到期时间: {{ scope.row.update_time || '未授权' }}</span></div></template></el-table-column><el-table-column align="center" label="ip" prop="ip" width="180px"></el-table-column><el-table-column align="center" label="ADB/API端口" prop="levelName" width="180px"><template #default="scope"><span v-if="scope.row.adb_port || scope.row.sdk_port">{{ scope.row.adb_port || '-' }} - {{ scope.row.sdk_port|| '-' }}</span><span v-else> - </span></template></el-table-column><el-table-column align="center" label="名称" prop="name" width="120px"><template #default="scope"><span v-if="scope.row.name">{{ scope.row.name }}</span><span v-else>-</span></template></el-table-column><el-table-column align="center" label="状态" prop="status" width="150px"><template #default="scope"><el-button plain :style="{backgroundColor: scope.row.status === 20 ? '#fef0f0' : scope.row.status === 10 ? '#f0f9eb' : '',borderColor: scope.row.status === 20 ? '#fde2e2' : scope.row.status === 10 ? '#e1f3d8' : '',color: scope.row.status === 20 ? '#f56c6c' : scope.row.status === 10 ? '#67c23a' : ''}" v-if="scope.row.status">{{ scope.row.status === 10 ? '运行中' : scope.row.status === 20 ? '关机' : '空闲' }}</el-button></template></el-table-column><el-table-column align="center" label="系统版本" prop="serial_no" width="150px"><template #default="scope"><span>版本1.0</span></template></el-table-column><el-table-column :show-overflow-tooltip="false" align="center" label="操作"><template #default="scope"><div class="cell"><el-button :type="scope.row.status === 20 ? 'success' : 'danger'" size="small"@click="handlePowerAction(scope.row)">{{ scope.row.status === 20 ? '开机' : '关机' }}</el-button><div class="el-dropdown flex flex-wrap items-center"><el-dropdown><el-button type="info">更多操作<el-icon class="el-icon--right"><arrow-down /></el-icon></el-button><template #dropdown><el-dropdown-menu><el-dropdown-item @click="handleoperate('restart', scope.row)">重启云机</el-dropdown-item><el-dropdown-item @click="handleoperate('edit', scope.row)">修改名称</el-dropdown-item><el-dropdown-item @click="handleoperate('remark', scope.row)">设置备注</el-dropdown-item><el-dropdown-item @click="handleoperate('random', scope.row)">随机设备信息</el-dropdown-item><el-dropdown-item @click="handleoperate('mirror', scope.row)">切换镜像</el-dropdown-item><el-dropdown-item @click="handleoperate('reset', scope.row)">重置云机</el-dropdown-item><el-dropdown-item @click="handleoperate('copy', scope.row)">复制云机</el-dropdown-item><el-dropdown-item @click="handleoperate('delete', scope.row)">删除云机</el-dropdown-item><el-dropdown-item @click="handleoperate('terminal', scope.row)">终端窗口</el-dropdown-item></el-dropdown-menu></template></el-dropdown></div><div class="flex flex-wrap items-center"><el-dropdown><el-button type="primary">选择网络<el-icon class="el-icon--right"><arrow-down /></el-icon></el-button><template #dropdown><el-dropdown-menu><el-dropdown-item @click="handleSelectVPC">（旧）选择VPC网络</el-dropdown-item><el-dropdown-item>（新）选择VPC网络</el-dropdown-item></el-dropdown-menu></template></el-dropdown></div></div></template></el-table-column></el-table><!-- 创建 --><el-dialog v-model="createdVisible" title="创建安卓" width="500"><el-form :model="formCreate"><el-form-item label="云机数量" :label-width="formLabelWidth"><el-input-number v-model="formCreate.num" autocomplete="off" :min="1" :max="12" /></el-form-item><el-form-item label="镜像类型" :label-width="formLabelWidth"><el-radio-group v-model="formCreate.img_type"><el-radio label="10">基础镜像</el-radio><el-radio label="20">GMS镜像</el-radio></el-radio-group><el-button type="primary" size="small" style="margin-left: 10px" @click="handleSwitchImage"><el-icon><Refresh /></el-icon>&nbsp; 切换</el-button></el-form-item><el-form-item label="DNS设置" :label-width="formLabelWidth"><el-select v-model="formCreate.dns" @change="selectDns" placeholder="请选择DNS" class="w130" filterable><el-option v-for="item in setDns" :key="item.id" :label="item.name" :value="item.id" /></el-select></el-form-item><el-form-item label="屏幕刷新率" :label-width="formLabelWidth"><el-select v-model="formCreate.fps" placeholder="请选择刷新率"><el-option label="60 FPS" value="60" /><el-option label="90 FPS" value="90" /><el-option label="120 FPS" value="120" /></el-select></el-form-item><!-- <el-form-item label="VPC网络" :label-width="formLabelWidth"><el-select v-model="formCreate.vpc" placeholder="请选择VPC"><el-option label="VPC网络 1" value="vpc1" /><el-option label="VPC网络 2" value="vpc2" /><el-option label="VPC网络 3" value="vpc3" /></el-select></el-form-item> --></el-form><template #footer><div class="dialog-footer"><el-button @click="createdVisible = false">取消</el-button><el-button type="primary" @click="createdDialog(row)">确定</el-button></div></template></el-dialog><!-- 修改 --><el-dialog v-model="dialogFormVisible" title="修改云机名称" width="500"><el-form :model="formEdit"><el-form-item label="名称" :label-width="formLabelWidth"><el-input v-model="formEdit.new_name" autocomplete="off" /></el-form-item></el-form><template #footer><div class="dialog-footer"><el-button @click="dialogFormVisible = false">取消</el-button><el-button type="primary" @click="editDialog(row)">确定</el-button></div></template></el-dialog><!-- 设置备注 --><el-dialog v-model="remarkVisible" title="设置云机备注" width="500"><el-form :model="formRemark"><el-form-item label="云机备注" :label-width="formLabelWidth"><el-input v-model="formRemark.name" autocomplete="off" /></el-form-item></el-form><template #footer><div class="dialog-footer"><el-button @click="remarkVisible = false">取消</el-button><el-button type="primary" @click="remarkVisible = false">确定</el-button></div></template></el-dialog><!-- 切换云机镜像 --><el-dialog v-model="mirrorVisible" title="切换云机镜像" width="500"><el-form :model="formMirror"><el-form-item label="云机镜像" :label-width="formLabelWidth"><el-select v-model="formMirror.mirror" multiple placeholder="请选择" style="width: 240px"><el-option v-for="item in mirrorList" :key="item.value" :label="item.label" :value="item.value" /></el-select></el-form-item><p>说明：如何切换的镜像不存在，系统会先拉取镜像，这个过程比较耗时请耐心等待。</p></el-form><template #footer><div class="dialog-footer"><el-button @click="mirrorVisible = false">取消</el-button><el-button type="primary" @click="mirrorVisible = false">确定</el-button></div></template></el-dialog><!-- 随机设备信息 --><el-dialog v-model="randomVisible" title="随机设备信息" width="500"> </el-dialog><!-- 复制云机 --><el-dialog v-model="copyVisible" title="复制云机" width="500"><el-form :model="formCopy"><span>云机复制数量</span><el-input-number v-model="formCopy.num" :min="1" :max="10" /></el-form><span>说明：复制请先关闭云机。相同实例号的云机，同时只能有一台为开机状态。复制云机比较耗时请耐心等待</span><template #footer><div class="dialog-footer"><el-button @click="copyVisible = false">取消</el-button><el-button type="primary" @click="handleCopy(row)">确定</el-button></div></template></el-dialog><!-- 重置云机 --><el-dialog v-model="resetVisible" title="提示" width="500"><el-icon><WarningFilled /></el-icon> <span>确定要重置此云机?</span><template #footer><div class="dialog-footer"><el-button @click="resetVisible = false">取消</el-button><el-button type="primary" @click="handleReset(row)">确定</el-button></div></template></el-dialog><!-- 删除云机 --><el-dialog v-model="deleteVisible" title="提示" width="500"><el-icon><WarningFilled /></el-icon> <span>确定要删除此云机?</span><template #footer><div class="dialog-footer"><el-button @click="deleteVisible = false">取消</el-button><el-button type="primary" @click="handleDele(row)">确定</el-button></div></template></el-dialog><!-- 终端窗口 --><el-dialog v-model="terminalVisible" title="终端窗口" width="500"><iframe src="http://192.168.1.100:8080" frameborder="0" width="100%" height="500px"></iframe><template #footer> </template></el-dialog><!-- 选择网络 --><el-dialog v-model="networkVisible" title="选择网络" width="500"><el-form :model="formNetwork"><el-form-item label="VPC网络" :label-width="formLabelWidth"><el-select v-model="formNetwork.network" placeholder="请选择"><el-option label="VPC网络1" value="1" /><el-option label="VPC网络2" value="2" /><el-option label="VPC网络3" value="3" /></el-select></el-form-item></el-form></el-dialog></div>
</template>
<script setup>
import { ref, reactive, nextTick } from 'vue'
import andriodList from '@/network/andriodList'
import { ElMessage } from 'element-plus'// 搜索条件
const formData = reactive({name: '',
})
const loading = ref(false); // 列表的加载中
const list = ref([{}]) // 列表的数据const queryAndroidList = async (flag) => {// 根据搜索条件设置查询参数if (flag) {formData.name = formData.name.trim()}loading.value = truetry {const res = await andriodList.getAllAndroidList({name: formData.name})if (res.code === 200) {let allDataList = [];res.data && res.data.length > 0 && res.data.forEach((item, index) => {item.list_cnt && item.list_cnt.length > 0 && item.list_cnt.forEach((item2, index2) => {allDataList.push({...item,// ...item2, 看具体需求  处理列表所需字段, 将list_cnt里的数据平铺开idx: item2.idx,name: item2.name,status: item2.status,data_dir: item2.data_dir,update_time: item2.update_time,sdk_port1: item2.sdk_port,adb_port1: item2.adb_port,cnt_id1: item2.cnt_id,})})})list.value = allDataList;} else {list.value = []}} catch (error) {list.value = []} finally {loading.value = false}
}
// 初始化获取列表
queryAndroidList()const selectIds = ref([]);
// 行复选框选中项变化
function handleSelectVPC(selection) {selectIds.value = selection.map(item => item.id);
}function handleQuery() {loading.value = true;
}
// 多选框选中数据
function handleSelectionChange(selection) {selectIds.value = selection.map(item => item.id);
}/*** 合并行或列* @param row 行号* @param col 列号* @param rowspan 行合并数* @param colspan 列合并数*  @param rowIndex 当前行号* @param columnIndex 当前列号* */
const objectSpanMethod = ({row,column,rowIndex,columnIndex,
}) => {if (column.property === 'idx') {if (rowIndex > 0 && list.value[rowIndex].idx === list.value[rowIndex - 1].idx) {return {rowspan: 0,colspan: 0,}}return {rowspan: getRowspan('idx', rowIndex),colspan: 1,}}
}// 获取行合并数
const getRowspan = (key, rowIndex) => {let rowspan = 1; //默认合并1行let curVal = list.value[rowIndex][key]; //存储了当前值for (let i = rowIndex + 1; i < list.value.length; i++) {if (list.value[i][key] === curVal) {rowspan++;} else {break;}}return rowspan;
}// 选择DNS
const setDns = ref([{id: '1',name: 'DNS1'
},
{id: '2',name: 'DNS2'}])
const selectDns = async () => { }//创建弹窗
const formCreate = reactive({idx: '',num: 1,img_type: "10",dns: '',fps: '',
})const createdVisible = ref(false)
// 创建实例
function handleCreate(row) {createdVisible.value = true;formCreate.idx = row.idx; // 保存idx到formCreate中
}const handleCreateAndroid = async () => {try {const res = await andriodList.createAPI({idx: formCreate.idx, // 使用保存的idxnum: formCreate.num,img_type: formCreate.img_type,dns: formCreate.dns,fps: formCreate.fps,})if (res.code === 200) {ElMessage.success(res.msg)createdVisible.value = false// 刷新列表queryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}//确定创建弹窗
function createdDialog() {handleCreateAndroid()
}// 编辑实例
function handleEdit(row) {console.log('编辑实例:', row);
}//切换镜像
const handleSwitchImage = () => {console.log('切换镜像');
}//开机--关机 --status 容器状态 10 运行中 20 关机
let runId = null
async function handlePowerAction(row) {runId = row.cnt_id1const status = row.statustry {let resif (status === 10) {res = await andriodList.stopAPI({cnt_id: runId})} else {res = await andriodList.runAPI({cnt_id: runId})}if (res.code === 200) {ElMessage.success(res.msg)queryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}//重启云机
const restarCnt = async () => {try {const res = await andriodList.restart({cnt_id: publicId})if (res.code === 200) {ElMessage.success(res.msg)// 重启成功后重新获取列表queryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}const formEdit = reactive({cnt_id: '',new_name: '',
})
const dialogFormVisible = ref(false)
const formLabelWidth = '140px'const handleEditName = async () => {try {const res = await andriodList.renameAPI({cnt_id: formEdit.cnt_id,new_name: formEdit.new_name})if (res.code === 200) {ElMessage.success(res.msg)dialogFormVisible.value = falsequeryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}
//修改弹窗
function editDialog() {handleEditName()
}//设置备注
const formRemark = reactive({name: '',
})
const remarkVisible = ref(false)//切换
const formMirror = reactive({mirror: '',
})
const mirrorList = [{value: '1',label: '镜像1'
}]
const mirrorVisible = ref(false)//随机
const randomVisible = ref(false)//复制
const formCopy = reactive({num: 1,src_cnt_id: "",target_cnt_idx: "",target_cnt_name: "",
})
const copyVisible = ref(false)
//复制弹窗
function handleCopy() {handleCopyAPI()
}const handleCopyAPI = async () => {try {const res = await andriodList.copyAPI({num: formCopy.num,src_cnt_id: formCopy.src_cnt_id,target_cnt_idx: formCopy.target_cnt_idx,target_cnt_name: formCopy.target_cnt_name,})if (res.code === 200) {ElMessage.success(res.msg)copyVisible.value = falsequeryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}//重置  
const resetVisible = ref(false)
const handleResetId = async () => {try {const res = await andriodList.resetAPI({cnt_id: publicId})if (res.code === 200) {ElMessage.success(res.msg)deleteVisible.value = falsequeryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}//重置弹窗
function handleReset() {handleResetId()
}//删除
const deleteVisible = ref(false)
const handleDeleId = async () => {try {const res = await andriodList.deleteCntAPI({cnt_id: publicId})if (res.code === 200) {ElMessage.success(res.msg)deleteVisible.value = falsequeryAndroidList()} else {ElMessage.error(res.msg)}} catch (error) {ElMessage.error(res.msg)}
}//删除
function handleDele() {handleDeleId()
}//终端
const terminalVisible = ref(false)//选择网络
const formNetwork = reactive({network: '',
})
const networkVisible = ref(false) //选择网络弹窗  //操作
let publicId = null // 公共id
function handleoperate(type, row) {publicId = row.cnt_id1 // 获取第一个云机的cnt_idswitch (type) {case 'restart':restarCnt(row)break;case 'edit':dialogFormVisible.value = true;formEdit.cnt_id = publicId;formEdit.new_name = row.name;break;case 'remark':remarkVisible.value = true;break;case 'random':randomVisible.value = true;break;case 'mirror':mirrorVisible.value = true;break;case 'copy':copyVisible.value = true;formCopy.src_cnt_id = publicId;formCopy.target_cnt_name = row.name;formCopy.target_cnt_idx = row.idx;break;case 'terminal':terminalVisible.value = true;break;case 'reset':// 处理重置操作resetVisible.value = true;break;case 'delete':// 处理删除操作deleteVisible.value = true;break;default:break;}
}</script><style lang="scss" scoped>
.app-container {.search-bar {.el-icon {color: #fff;}}.cell {display: flex;justify-content: center;align-items: center;}.el-dropdown {margin-left: 10px;}.examples {display: flex;justify-content: center;}.time-line {margin-top: 10px;color: rgb(235, 0, 0);font-size: 14px;}
}
</style>

代码中会有一些注释，根据个人需求可以进行参考，此需求也涉及到按钮操作的，如果没有次需求可以忽略不看。

以上就是列表的合并单元格，如果对你有帮助，麻烦点个赞呗~ 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/web/64813.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

关于AI面试系统2025年趋势评估！

关于AI面试系统2025年趋势评估！

在快速发展的科技浪潮中&#xff0c;AI技术正以前所未有的速度渗透到各行各业。企业招聘领域&#xff0c;作为人才选拔的关键环节&#xff0c;也不例外地迎来了AI面试系统的广泛应用和持续创新。2025年&#xff0c;AI面试系统不仅成为企业招聘的主流工具&#xff0c;更在智能化…
阅读更多...
MySQL 01 02 章——数据库概述与MySQL安装篇

MySQL 01 02 章——数据库概述与MySQL安装篇

一、数据库概述 &#xff08;1&#xff09;为什么要使用数据库 数据库可以实现持久化&#xff0c;什么是持久化&#xff1a;数据持久化意味着将内存中的数据保存到硬盘上加以“固化”持久化的主要作用是&#xff1a;将内存中的数据存储在关系型数据库中&#xff0c;当然也可以…
阅读更多...
Vue3 组件

Vue3 组件

文章目录 Vue3 组件概述根组件定义和使用组件样式控制全局样式局部样式深度样式 Vue3 组件 概述 组件允许我们将 UI 划分为独立的、可重用的部分&#xff0c;并且可以对每个部分进行单独的思考。在实际应用中&#xff0c;组件常常被组织成层层嵌套的树状结构&#xff1a; 根…
阅读更多...
怎么在家访问公司服务器？

怎么在家访问公司服务器？

在日常工作中&#xff0c;特别是对信息技术从业者而言&#xff0c;工作往往离不开公司的服务器。他们需要定期访问服务器&#xff0c;获取一些关键的机密文件或数据。如果您在家办公&#xff0c;并且需要处理未完成的任务&#xff0c;同时需要从公司服务器获取所需的数据&#…
阅读更多...
IP-Guard对SolidWorks PDM 加密授权说明

IP-Guard对SolidWorks PDM 加密授权说明

SolidWorks PDM 加密授权说明 一、简介 该功能主要实现了，在SolidWorks Enterprise PDM环境下，可以正常"检入"和"检出" 加密文件，并可以正常预览加密文件。 二、操作说明 2.1 设置加密授权 安装客户端后，登录控制台，选择客户端计算机或组右键选择“…
阅读更多...
AI 助力游戏开发中的常用算法实现

AI 助力游戏开发中的常用算法实现

在当今的游戏开发领域&#xff0c;人工智能&#xff08;AI&#xff09;技术的应用已经成为推动行业发展的关键力量。AI不仅能够提升游戏的智能化水平&#xff0c;还能够增强玩家的沉浸感和游戏体验。随着技术的进步&#xff0c;AI在游戏设计、开发和测试中的应用越来越广泛&…
阅读更多...
重现ORA-01555 细说Oracle Undo 数据管理

重现ORA-01555 细说Oracle Undo 数据管理

1. 概述 1.1. Undo 数据应用 undo数据是&#xff1a; 原始的、修改之前的数据副本 是针对更改数据的每个事务处理所捕获的 至少保留到事务处理结束 用于支持&#xff1a; 回退操作 读取一致性查询 闪回查询、闪回事务处理和闪回表 从失败的事务处理中进行恢复 1.2. 事…
阅读更多...
Java 集合 Collection、List、Set

Java 集合 Collection、List、Set

一. Collection 单列集合 1. Collection代表单列集合&#xff0c;每个元素(数据)只包含一个值 2. Collection集合特点 ① List系列集合&#xff1a;添加的元素是有序、可重复、有索引。 ArrayList、LinekdList&#xff1a;有序、可重复&#xff0c;有索引 ② Set系列集合&…
阅读更多...
wamp php7.4 运行dm8

wamp php7.4 运行dm8

背景 1、电脑安装了dm8&#xff0c;具体参照官网dm8安装 2、安装好了wamp&#xff0c;我当前的php版本切换成了7.4的&#xff0c;我wamp的安装路径d:\wamp64\ 操作 3、查看phpinfo&#xff0c;如果Thread Safet为enabled&#xff0c;则选择pdo74_dm.dll&#xff0c;否则选择…
阅读更多...
linux 系统 mysql ：8.4.3 主从复制 教程及运维命令

linux 系统 mysql ：8.4.3 主从复制 教程及运维命令

一、环境准备 硬件配置CPU2 核 CPU内存2 GB 内存硬盘30 GB 硬盘容量外网访问服务器可以访问外网软件环境操作系统Anolis OS 7.9MySQL版本8.4.3 二、服务器清单 Master192.168.153.221Node192.168.153.222 三、安装mysql &#xff08;两台机器都要下载&#xff09; # 下载 …
阅读更多...
UE5材质节点Camera Vector/Reflection Vector

UE5材质节点Camera Vector/Reflection Vector

Camera Vector相机向量&#xff0c;输出像素到相机的方向&#xff0c;结果归一化 会随着相机移动而改变 Reflection Vector 反射向量&#xff0c;物体表面法线反射到相机的方向&#xff0c;x和y和camera vector相反 配合hdr使用
阅读更多...
复合机器人正以其高效、精准、灵活的特点，逐渐在汽车装配线上崭露头角

复合机器人正以其高效、精准、灵活的特点，逐渐在汽车装配线上崭露头角

随着全球汽车制造业的快速发展&#xff0c;汽车装配线已成为衡量企业生产效率和技术水平的重要标准。传统的装配方式往往依赖于大量的人工操作&#xff0c;这不仅效率低下&#xff0c;还面临着质量不稳定、安全隐患等问题。然而&#xff0c;随着智能科技的飞速进步&#xff0c;…
阅读更多...
导致启动nacos报错Caused by: java.lang.IllegalStateException: No DataSource set 的两种原因

导致启动nacos报错Caused by: java.lang.IllegalStateException: No DataSource set 的两种原因

Java资深小白&#xff0c;不足之处&#xff0c;或者有任何错误欢迎指出。 --蓝紫报错代码如下: C:\Windows\System32>cd D:\nacos-server-2.2.3\nacos\binC:\Windows\System32>d:D:\nacos-server-2.2.3\nacos\bin>startup.cmd -m standalone "nacos is starting…
阅读更多...
LinuxUbuntu打开VSCode白屏解决方案

LinuxUbuntu打开VSCode白屏解决方案

解决方法是 以root权限打开VSCode sudo /usr/share/code/code --no-sandbox --unity-launch
阅读更多...
C语言期末复习笔记（下）

C语言期末复习笔记（下）

目录 九、指针 1.指针变量的定义和初始化 2.间接寻址符* 3.按值调用和按址调用 4.实例 5.函数指针 6.指针变量和其它类型变量的对比 十、字符串 1.字符串常量 2.字符串的存储 3.字符指针 4.字符串的访问和输入/输出 5.字符串处理函数 &#xff08;1&#xff09;str…
阅读更多...
1、蓝牙打印机环境搭建

1、蓝牙打印机环境搭建

本项目采用stm32f103c8T6芯片&#xff0c;通过库函数实现打印功能&#xff0c;并配置有小程序蓝牙通信上位机。 1、创建文件夹目录 core文件夹存放核心库文件 LIB文件夹存放标准库函数文件 这里可以删减&#xff0c;用不到的可以不要。 obj存放编译后的文件 project存放项目…
阅读更多...
多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测

多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测

多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测 目录 多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测预测效果基本介绍模型背景程序设计参考资料 预测效果 基本介绍 Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入…
阅读更多...
Leecode刷题C语言之切蛋糕的最小总共开销②

Leecode刷题C语言之切蛋糕的最小总共开销②

执行结果:通过 执行用时和内存消耗如下&#xff1a; typedef struct {int *booked;int bookedSize; } MyCalendar;#define MAX_BOOK_SIZE 1001MyCalendar* myCalendarCreate() {MyCalendar *obj (MyCalendar *)malloc(sizeof(MyCalendar));obj->booked (int *)malloc(siz…
阅读更多...
力扣-数据结构-10【算法学习day.81】

力扣-数据结构-10【算法学习day.81】

前言 ###我做这类文章一个重要的目的还是给正在学习的大家提供方向&#xff08;例如想要掌握基础用法&#xff0c;该刷哪些题&#xff1f;建议灵神的题单和代码随想录&#xff09;和记录自己的学习过程&#xff0c;我的解析也不会做的非常详细&#xff0c;只会提供思路和一些关…
阅读更多...
Vue 全局事件总线：Vue 2 vs Vue 3 实现

Vue 全局事件总线：Vue 2 vs Vue 3 实现

&#x1f31f; 前言 欢迎来到我的技术小宇宙&#xff01;&#x1f30c; 这里不仅是我记录技术点滴的后花园&#xff0c;也是我分享学习心得和项目经验的乐园。&#x1f4da; 无论你是技术小白还是资深大牛&#xff0c;这里总有一些内容能触动你的好奇心。&#x1f50d; &#x…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023