vue2日历组件
【效果图】
<template><div style="width: 100%"><!-- <div> --><!-- <div>{{ startDate.getMonth() + 1 + '-' + startDate.getDate() }}</div><div>{{ endDate.getMonth() + 1 + '-' + endDate.getDate() }}</div> --><!-- <button @click="generateDates">生成日期</button> --><div class="lableBoxClass flexBetween"><div class="lableClass">请假日期</div><div>{{ selectedDatesStr }}</div></div><div class="calenderBoxClass"><!-- <div>选中的日期:{{ selectedDatesStr }}</div> --><div class="date-scale"><span v-for="(day, index) in scaleDays" :key="index">{{ day }}</span></div><ul class="date-list"><li v-for="(date, index) in showDates" :key="index"><div @click="toggleDateSelection(date)" class="date-item" :class="{ grayColor: isDateDisabled(date), selected: isSelected(date) }">{{ date }}</div></li></ul></div></div>
</template><script>
import { Toast } from 'vant'
export default {name: 'CalendarVue',props: {startDate: {type: Date,default() {return new Date()}},endDate: {type: Date,default() {return new Date()}}},data() {return {// startDate: new Date('2024-12-19'),// endDate: new Date('2025-01-05'),showDates: [], // 用于存储页面显示的日期数组selectableDates: [], // 用于存储可选的日期数组scaleDays: ['一', '二', '三', '四', '五', '六', '日'], // 用于存储日期刻度的数组selectedDates: {}, // 用于存储选中的日期,键为日期,值为是否选中selectedDatesArr: [] // 用于存储选中的日期数组}},computed: {selectedDatesStr() {if (this.selectedDatesArr.length > 0) {return this.selectedDatesArr.join(',')}return '请点击需要请假的日期'}},created() {// 生成日期this.generateDates()this.getSelectableDates()},mounted() {},methods: {isDateDisabled(date) {return !this.selectableDates.includes(date)},generateDates() {if (!this.startDate || !this.endDate) {alert('请选择开始日期和结束日期')return}// 重置日期数组和刻度数组this.showDates = []const startDate = new Date(this.startDate)const endDate = new Date(this.endDate)console.log(90, this.formatDate(startDate), this.formatDate(endDate))// 找到第一个星期一let currentDate = new Date(startDate)while (currentDate.getDay() !== 1) {// getDay() 返回的是 0(星期日) 到 6(星期六)currentDate.setDate(currentDate.getDate() + 1)}// 重新设置currentDate为区间开始日期currentDate = new Date(startDate)this.showDates = [...this.getDatesFromThisMonday(this.startDate)]console.log(100, this.showDates)// 生成日期数组while (currentDate <= endDate) {this.showDates.push(this.formatDate(currentDate))currentDate.setDate(currentDate.getDate() + 1)}console.log(107, this.showDates)let nextSundayArr = this.getDatesFromEndDateToNextSunday(this.endDate)if (nextSundayArr.length > 0) {nextSundayArr.forEach(item => {this.showDates.push(item)})}console.log(115, this.showDates)},// formatDate(date)<-->将日期对象转换为 "月份.日期" 格式formatDate(date) {const month = date.getMonth() + 1 // 月份从0开始,所以需要+1const day = date.getDate()return `${month}.${day}`},getSelectableDates() {let startShowDate = new Date(this.startDate)let endShowDate = new Date(this.endDate)console.log(131, startShowDate, endShowDate)while (startShowDate < endShowDate) {let formattedDate = startShowDate.getMonth() + 1 + '.' + startShowDate.getDate()this.selectableDates.push(formattedDate) // 将格式化后的日期添加到数组中startShowDate.setDate(startShowDate.getDate() + 1) // 移动到下一天}console.log(138000, this.selectableDates)// return this.selectableDates},//getDatesFromThisMonday(startDate)<-->获取从当前周一到起始日期【startDate】的日期数组,并转换为 "月份.日期" 格式(与参数【showDates】(页面展示的日期)相关)getDatesFromThisMonday(startDate) {// 创建一个当前日期的副本,以避免修改原始日期对象let today = new Date(startDate.getTime())// 找到这周一的日期let thisMonday = new Date(today.getTime())thisMonday.setDate(today.getDate() - today.getDay() + (today.getDay() === 0 ? -6 : 1)) // 设置为周一// 生成从这周一到今天的日期数组,并转换为 "月份.日期" 格式let dates = []let current = new Date(thisMonday.getTime()) // 从这周一开始while (current < today) {// 包含今天// 转换日期格式为 "月份.日期"let formattedDate = current.getMonth() + 1 + '.' + current.getDate()dates.push(formattedDate) // 将格式化后的日期添加到数组中current.setDate(current.getDate() + 1) // 移动到下一天}// console.log(136, dates)return dates // 返回日期数组},//getDatesFromEndDateToNextSunday(endDate)<-->获取从结束日期【endDate】到下一个周日之间的所有日期数组,并转换为 "月份.日期" 格式(与参数【showDates】(页面展示的日期)相关)getDatesFromEndDateToNextSunday(endDate) {let current = new Date(endDate.getTime())// 如果endDate是周日,则将日期设置为下一天(周一)if (current.getDay() == 0) {return []}current.setDate(current.getDate() + 1)let dates = []// 循环直到当前日期是下一个周日while (current.getDay() !== 0) {// 格式化日期为 "月份.日期"let formattedDate = current.getMonth() + 1 + '.' + current.getDate()// 将格式化后的日期字符串添加到数组中dates.push(formattedDate)// 将日期加1天current.setDate(current.getDate() + 1)}// 如果endDate不是周日,我们才添加当前周日if (endDate.getDay() !== 0) {let formattedSunday = current.getMonth() + 1 + '.' + current.getDate()dates.push(formattedSunday)}console.log(165, dates)// 返回包含所有格式化日期的数组return dates},toggleDateSelection(date) {// 切换日期的选中状态if (this.isDateDisabled(date)) {Toast('不可选择范围外的日期')return}// 切换选中状态const isSelected = this.isSelected(date)this.$set(this.selectedDates, date, !isSelected)// 根据新的选中状态更新数组if (!isSelected) {// 如果之前未选中,现在选中了,则添加到数组中this.selectedDatesArr.push(date)} else {// 如果之前已选中,现在取消了,则从数组中移除const index = this.selectedDatesArr.indexOf(date)if (index !== -1) {this.selectedDatesArr.splice(index, 1)}}},isSelected(date) {// 检查日期是否被选中return this.selectedDates[date] === true}}
}
</script>
<style lang="scss" scoped>
.lableBoxClass {padding: 15px;font-size: 15px;display: flex;.lableClass {width: 100px;color: #1f2022;flex-shrink: 0;&::after {content: '*'; /* 使用Unicode字符表示红星 */color: red;margin-left: 5px;}}
}
.calenderBoxClass {// padding-left: 15px;// padding-right: 10px;// background-color: yellow;
}
</style><style scoped>
.date-scale {display: flex;flex-direction: row;justify-content: space-around;flex: 0 0 calc(100% / 7 - 10px); /* 假设你想要每个日期项之间有10px的间隙 */margin: 5px; /* 这将创建10px的间隙(每个方向5px) */text-align: center;margin-bottom: 10px;
}
.date-scale span {display: inline-block;width: 30px; /* 根据需要调整刻度宽度 */text-align: center;
}.date-scale {display: flex;justify-content: space-between;
}.date-list {display: flex;flex-wrap: wrap;list-style: none;padding: 0;
}.date-list li {flex: 0 0 calc(100% / 7 - 10px); /* 假设你想要每个日期项之间有10px的间隙 *//*width: calc(100vw / 7- 10px); */text-align: center;font-style: 16px;
}
.date-item {/*margin: 5px;*/background-color: #e6eefc;width: calc(100vw / 7);margin-bottom: 8px;height: 30px;display: flex;justify-content: center;align-items: center;cursor: pointer;
}
.date-list:nth-child(3) {border-radius: 10px;
}
.grayColor {color: gray;background-color: white;
}.selected {background-color: rgb(19, 96, 231); /* 选中的日期背景色为蓝色 */color: white; /* 选中的日期字体颜色为白色 */border-radius: 5px;
}
</style>
调用组件
<CalendarVue :startDate="startDate" :endDate="endDate" />
相关文章:
vue2日历组件
【效果图】 <template><div style"width: 100%"><!-- <div> --><!-- <div>{{ startDate.getMonth() 1 - startDate.getDate() }}</div><div>{{ endDate.getMonth() 1 - endDate.getDate() }}</div> --&g…...
Unity C# 影响性能的坑点
c用的时间长了怕unity的坑忘了,记录一下。 GetComponent最好使用GetComponent<T>()的形式, 继承自Monobehaviour的函数要避免空的Awake()、Start()、Update()、FixedUpdate().这些空回调会造成性能浪费 GetComponent方法最好避免在Update当中使用…...
Redis(概念、IO模型、多路选择算法、安装和启停)
一、概念 关系型数据库是典型的行存储数据库,存在的问题是,按行存储的数据在物理层面占用的是连续存储空间,不适合海量数据存储。 Redis在生产中使用的最多的是用作数据缓存。 服务器先在缓存中查询数据,查到则返回,…...
多线程
线程是什么? 1、线程是进程的执行分支,一个进程内部的控制程序 2、一个进程至少有一个执行线程 3、从CPU角度来看,线程就是一个更轻量化的线程 4、线程在进程内部运行,所以本质就是在进程地址空间上运行 注意: 一…...
Spring Boot林业产品推荐系统:用户指南
摘 要 网络技术和计算机技术发展至今,已经拥有了深厚的理论基础,并在现实中进行了充分运用,尤其是基于计算机运行的软件更是受到各界的关注。加上现在人们已经步入信息时代,所以对于信息的宣传和管理就很关键。因此林业产品销售信…...
计算机网络 实验八 应用层相关协议分析
一、实验目的 熟悉CMailServer邮件服务软件和Outlook Express客户端软件的基本配置与使用;分析SMTP及POP3协议报文格式和SMTP及POP3协议的工作过程。 二、实验原理 为了观察到邮件发送的全部过程,需要在本地计算机上配置邮件服务器和客户代理。在这里我…...
实战ansible-playbook:Ansible Vault加密敏感数据(三)
在实际生产环境中,使用 Ansible Vault 来加密敏感数据是一种常见的做法。以下是一个详细的步骤和实际生产环境的使用案例,展示如何使用 Ansible Vault 来加密和管理敏感数据。 1. 安装 Ansible 确保你已经安装了 Ansible。如果还没有安装,可以使用以下命令进行安装: # 在…...
oracle 12c查看执行过的sql及当前正在执行的sql
V$SQL 提供了已经执行过及正在执行的SQL语句的信息。 一 查看共享池中所有sql的统计信息 #统计共享池中某类sql执行次数,总体执行时长,平均执行时长等信息,并按总体执行时长降序排序 SELECT INST_ID,SQL_ID,SQL_TEXT,SQL_FULLTEXT,EXECUTI…...
【大模型】Spring AI Alibaba 对接百炼平台大模型使用详解
目录 一、前言 二、Spring AI概述 2.1 spring ai是什么 2.2 Spring AI 核心能力 2.3 Spring AI 应用场景 三、Spring AI Alibaba 介绍 3.1 Spring AI Alibaba 是什么 3.2 Spring AI Alibaba 核心特点 3.3 Spring AI Alibaba 应用场景 四、SpringBoot 对接Spring AI Al…...
CSS:怎么把网站都变成灰色
当大家看到全站的内容都变成了灰色,包括按钮、图片等等。这时候我们可能会好奇这是怎么做到的呢? 有人会以为所有的内容都统一换了一个 CSS 样式,图片也全换成灰色的了,按钮等样式也统一换成了灰色样式。但你想想这个成本也太高了…...
Maven 常用命令
Maven 是一个强大的构建自动化工具,主要用于 Java 项目的管理和构建。 理解 Maven 命令对于高效管理与构建您的 Java 项目至关重要。 在本篇博客中,我们将探索每个 Java 开发者都应该掌握的一些最重要的 Maven 命令。 1. 设置 Maven 在深入探讨 Mave…...
【算法day1】数组:双指针算法
题目引用 这里以 1、LeetCode704.二分查找 2、LeetCode27.移除元素 3、LeetCode977.有序数组的平方 这三道题举例来说明数组中双指针的妙用。 1、二分查找 给定一个 n 个元素有序的(升序)整型数组 nums 和一个目标值 target ,写一个函数搜…...
CTF之密码学(DES)
一、基本原理 DES加密使用相同的密钥进行加密和解密操作。它使用一个56位的密钥(另外8位为奇偶校验位,不直接参与加密过程,因此实际密钥长度为56位),对64位的数据块进行加密,得到64位的密文。加密过程主要…...
【css实现收货地址下边的平行四边形彩色线条】
废话不多说,直接上代码: <div class"address-block" ><!-- 其他内容... --><div class"checked-ar"></div> </div> .address-block{height:120px;position: relative;overflow: hidden;width: 500p…...
Linux—进程概念学习-03
目录 Linux—进程学习—31.进程优先级1.1Linux中的进程优先级1.2修改进程优先级—top 2.进程的其他概念3.进程切换4.环境变量4.0环境变量的理解4.1环境变量的基本概念4.2添加环境变量—export4.3Linux中环境变量的由来4.4常见环境变量4.5和环境变量相关的命令4.6通过系统调用获…...
设计模式之破环单例模式和阻止破坏
目录 1. 序列化和反序列化2. 反射 这里单例模式就不多说了 23种设计模式之单例模式 1. 序列化和反序列化 这里用饿汉式来做例子 LazySingleton import java.io.Serializable;public class LazySingleton implements Serializable {private static LazySingleton lazySinglet…...
c++(斗罗大陆)
这次,作者编了斗罗大陆的武魂、魂力等级,目前只写到了11级 #include<iostream> #include<conio.h> #include<windows.h> #include<stdlib.h> #include<stdio.h> #include<time.h> #include<strin…...
NodeJs使用Addon调用C++
本文介绍的是NodeJs使用node-addon-api调用C的方法 node-addon-api是一个C封装,基于N-API构建,目的是提供一个更高级和更易用的接口,但它仍然依赖N-API。 官方参考文档 开发环境 必须具备NodeJs环境 Window配置NodeJs环境(绅士版…...
YOLOv11(Ultralytics)视频选定区域目标统计计数及跟踪
在计算机视觉的众多应用场景中,对特定区域的目标进行检测、跟踪与计数是一个常见且重要的需求。无论是在智慧交通中统计通过特定路口的车辆数量,还是在零售分析中追踪进入特定区域的顾客行为,这一功能都发挥着不可或缺的作用。 随着深度学习…...
【Nginx系列】Nginx配置优先级
💝💝💝欢迎来到我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…...
搭建私有docker仓库
1. 安装docker依赖包 sudo yum install -y yum-utils device-mapper-persistent-data lvm2 sudo yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo sudo yum install docker-ce docker-ce-cli containerd.io sudo systemctl …...
C语言练级->##__VA_ARGS__(可变参数)的用法
有什么用? 通常__VA_ARGS__用于宏定义,其中关于日志宏需要用的,printf 等支持可变参数的函数的宏封装。 首先我们先知道这个__VA_ARGS__的英文全称是“Variadic Arguments” 叫可变参数。说到可变参数学过C语言的朋友们应该都会想到printf&…...
在 wordpress 中简易目录插件添加滑动条
实现思路 给目录容器添加一个 固定高度,并设置 CSS 的 overflow 属性 为 auto 或 scroll,使其内容可滚动。确保目录的滚动行为独立于页面的整体滚动。优化用户体验,添加平滑滚动效果。 操作步骤 1. 检查目录的 HTML 结构 首先,…...
Linux和Ubuntu的关系
Linux和Ubuntu的关系: 1. Linux本身是内核,Ubuntu系统是基于Linux内核的操作系统。 2. Linux内核操作系统的构成: 内核、shell、文件系统、应用程序 -应用程序:文本编辑器等 -文件系统:文件存放在存储设备上的组织方…...
【大数据学习 | Spark-Core】详解Spark的Shuffle阶段
1. shuffle前言 对spark任务划分阶段,遇到宽依赖会断开,所以在stage 与 stage 之间会产生shuffle,大多数Spark作业的性能主要就是消耗在了shuffle环节,因为该环节包含了大量的磁盘IO、序列化、网络数据传输等操作。 负责shuffle…...
缓存方案分享
不知道大家平常更新缓存是怎么做的,但是大部分时候都是更新数据的同时更新缓存,今天和同事一起聊到一个缓存方案的问题,感觉很有趣、非常精妙,记录一下。 基于此本文将介绍几种常见的缓存更新策略,包括简单的缓存覆盖…...
从零开始配置Qt+VsCode环境
从零开始配置QtVsCode环境 文章目录 从零开始配置QtVsCode环境写在前面扩展安装及配置Qt Configure配置 VsCode创建Qt工程VsCodeQMakeMinGwVsCodeQMakeMsvcVsCodeCMakeMinGwVsCodeCMakeMsvcQtCreatorQMakeMinGw->VsCodeQtCreatorQMakeMsvc->VsCodeQtCreatorCMakeMinGw-&g…...
Linux中离线安装gcc
gcc在安装一些其他工具的经常用到,在此记录下如何安装gcc。 1.在线安装 yum -y install gcc 2.离线安装 2.1 获取安装包链接: https://pan.baidu.com/s/1oDvt64ByWs1w-evz5TXU7w?pwd9cfo mpfr-3.1.1-4.el7.x86_64.rpmlibmpc-1.0.1-3.el7.x86_64.rp…...
告别 Kafka,拥抱 Databend:构建高效低成本的用户行为分析体系
用户行为数据埋点指标是数据仓库中不可或缺的重要数据源之一,同时也是企业最宝贵的资产之一。通常情况下,用户行为数据分析包含两大数据源:用户行为分析日志和上游关系型数据库(如 MySQL)。基于这些数据,企…...
【python 迪杰斯特拉-最短路径算法】
- 算法实现 import heapq import networkx as nx import matplotlib.pyplot as pltdef dijkstra(graph, start, goal):distances {node: float("infinity") for node in graph}distances[start] 0parents {node: None for node in graph}priority_queue [(0, st…...
从〇开始深度学习(0)——背景知识与环境配置
从〇开始深度学习(0)——背景知识与环境配置 文章目录 从〇开始深度学习(0)——背景知识与环境配置写在前面1.背景知识1.1.Pytorch1.2.Anaconda1.3.Pycharm1.4.CPU与GPU1.5.整体关系 2.环境配置2.1.准备工作2.1.1.判断有无英伟达显卡2.1.2.清理电脑里的旧环境 2.1.安装Anaconda…...
【NLP 2、机器学习简介】
人生的苦难不过伏尔加河上的纤夫 —— 24.11.27 一、机器学习起源 机器学习的本质 —— 找规律 通过一定量的训练样本找到这些数据样本中所蕴含的规律 规律愈发复杂,机器学习就是在其中找到这些的规律,挖掘规律建立一个公式,导致对陌生的数…...
多目标优化算法——多目标粒子群优化算法(MOPSO)
Handling Multiple Objectives With Particle Swarm Optimization(多目标粒子群优化算法) 一、摘要: 本文提出了一种将帕累托优势引入粒子群优化算法的方法,使该算法能够处理具有多个目标函数的问题。与目前其他将粒子群算法扩展…...
Edify 3D: Scalable High-Quality 3D Asset Generation
Deep Imagination Research | NVIDIA 目录 一、Abstract 二、核心内容 1、多视图扩散模型 3、重建模型: 4、数据处理模块: 三、结果 1、文本到 3D 生成结果 2、图像到 3D 生成结果 3、四边形网格拓扑结构 一、Abstract NVIDIA 开发的用于高质量…...
探索校企合作新模式:职业院校大数据专业实验(实训)室建设指南
一、引言 作为一种强大的信息处理与分析工具,大数据技术在企业管理、科研探索、社会治理等多个领域均产生了广泛而深远的影响。在此背景下,大数据实验室的建设显得尤为重要,而校企合作则为这一建设提供了坚实的支撑。学校借助企业资源&#…...
YOLO的框架及版本迭代
YOLO(You Only Look Once)是一种非常流行的实时目标检测算法,其特点是将目标检测任务转换为一个回归问题,通过一次前向传播就可以同时完成目标的分类和定位。以下是YOLO框架的整体架构和工作原理: 一、YOLO的基本框架…...
第四十篇 DDP模型并行
摘要 分布式数据并行(DDP)技术是深度学习领域中的一项重要技术,它通过将数据和计算任务分布在多个计算节点上,实现了大规模模型的并行训练。 DDP技术的基本原理是将数据和模型参数分割成多个部分,每个部分由一个计算节点负责处理。在训练过程中,每个节点独立计算梯度,…...
鸿蒙进阶篇-状态管理之@Provide与@Consume
大家好,这里是鸿蒙开天组,今天我们来学习一下状态管理中的Provide与Consume。 一、概述 嘿!大家还记得这张图吗?不记得也要记得哦,因为这张图里的东西,既是高频必考面试题,也是实际开发中&…...
鸿蒙本地模拟器 模拟TCP服务端的过程
鸿蒙模拟器模拟TCP服务端的过程涉及几个关键步骤,主要包括创建TCPSocketServer实例、绑定IP地址和端口、监听连接请求、接收和发送数据以及处理连接事件。以下是详细的模拟过程: **1.创建TCPSocketServer实例:**首先,需要导入鸿蒙…...
Qt程序发布及打包成exe安装包
参考:Qt之程序发布以及打包成exe安装包 目录 一、简述 Qt 项目开发完成之后,需要打包发布程序,而因为用户电脑上没有 Qt 配置环境,所以需要将 release 生成的 exe 文件和所依赖的 dll 文件复制到一个文件夹中,然后再用 Inno Setup 打包工具打包成一个 exe 安装包,就可以…...
Spring Boot + ActiveMQ Artemis:快速实现高效消息队列处理功能
在现代微服务架构中,消息队列是实现异步通信、解耦系统的重要手段。而通过 Spring Boot 和 ActiveMQ Artemis,您可以快速搭建一个高效、可靠的消息队列处理系统,轻松应对订单处理、日志分析等场景。本文将带您从零开始,逐步实现一…...
【FPGA-MicroBlaze】串口收发以及相关函数讲解
前言 工具:Vivado2018.3及其所对应的SDK版本 目前网上有许多MicroBlaze 的入门教程,比如下面的这个参考文章,用串口打印一个hello world。 【FPGA】Xilinx MicroBlaze软核使用第一节:Hello World!_fpga软核microblaze-CSDN博客 个…...
CGAL CGAL::Polygon_mesh_processing::self_intersections解析
CGAL::Polygon_mesh_processing::self_intersections 是用于检测多边形网格(Polygon Mesh)中的自相交的函数。自相交是指网格中的某些面(例如三角形)与同一网格中的其他面交叉的情况。这种情况通常是不期望的,因为它会…...
猎户星空发布MoE大模型,推出AI数据宝AirDS
发布 | 大力财经 11月27日,猎户星空联合聚云科技举办了题为《Data Ready for Al,MoE大模型发布暨商业闭环分享》媒体见面会。猎户星空正式发布了自主研发的Orion-MoE 87B大模型,并携手聚云科技推出了基于该大模型的数据服务—AI数据宝AirDS&a…...
什么是JSON,有什么特点
什么是 JSON? JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。它基于 JavaScript 的子集,但独立于语言,被广泛用于服务器与 Web 应…...
SQL注入SQL盲注
SQL注入(SQL Injection)和 SQL盲注(Blind SQL Injection)是两种常见的Web安全攻击技术,用于攻击应用程序并操纵其与数据库的交互。以下是两者的概念和区别: 1. SQL注入 定义: SQL注入是通过将…...
汽车轮毂结构分析有哪些?国产3D仿真分析实现静力学+模态分析
本文为CAD芯智库原创,未经允许请勿复制、转载! 之前分享了如何通过国产三维CAD软件如何实现「汽车/汽配行业产品设计」,兼容NX(UG)、Creo(Proe),轻松降低企业上下游图纸交互成本等。…...
C++设计模式之组合模式在解决层次性问题中的好处
采用组合模式在处理层次型问题时,会带来以下重要好处: 简化客户端操作: 客户端代码可以统一地处理单个对象和组合对象,而无需区分它们。这意味着客户端可以使用相同的操作来对待所有对象,无论它们是简单的叶子节点还是…...
基于大数据爬虫+SpringBoot+Hive的网络电视剧收视率分析与可视化平台系统(源码+论文+PPT+部署文档教程等)
博主介绍:CSDN毕设辅导第一人、全网粉丝50W,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流✌ 技术范围:SpringB…...
【ESP32CAM+Android+C#上位机】ESP32-CAM在STA或AP模式下基于UDP与手机APP或C#上位机进行视频流/图像传输
前言: 本项目实现ESP32-CAM在STA或AP模式下基于UDP与手机APP或C#上位机进行视频流/图像传输。本项目包含有ESP32源码(arduino)、Android手机APP源码以及C#上位机源码,本文对其工程项目的配置使用进行讲解。实战开发,亲测无误。 AP模式,就是ESP32发出一个WIFI/热点提供给电…...