- 博客(50)
- 资源 (12)
- 收藏
- 关注
RSS订阅
原创 基于物联网的智慧农业监测系统（前端界面有web端和微信小程序端）
农业是国民经济的基础，在国家经济发展中有着不可替代的重要作用。随着物联网技术的快速发展，智慧农业已成为了现代农业发展的新方向。基于此，本文设计并实现了一套基于物联网的智慧农业监测系统，系统采用ESP32作为主控板，并搭载多种传感器，实时采集与农作物生长环境相关的温湿度、光照强度、土壤湿度、二氧化碳浓度等环境参数，然后通过MQTT将采集的数据上传到巴法云物联网平台，最后通过Web端和微信小程序端实现对农业的远程监测和自动预警处理。该系统的实现促进了农业精细化、高效化管理，为现代智慧农业提供一种可行的解决方案。
2022-06-07 21:55:29
45578
10
原创 Websocket的基本使用-聊天室案例
websocket 特点（1）实时通信：全双工协议，延迟更少，效率更高。（2）与HTTP协议有良好的兼容性：默认端口也是80 和 443，并且握手阶段采用HTTP协议，可以通过各种HTTP代理服务器，不容易被屏蔽。（3）控制开销：用于协议控制的数据包头部相对较小，数据格式比较简洁，性能开销比较小，通信高效。（4）二进制传输：可以发送文本，也可以发送二进制数据。（5）没有同源限制：可以实现客户端和服务器的任意通信。（6）实现简单：建立在TCP协议之上，服务器端的实现比较简单。
2024-03-28 10:07:26
914
原创 npm、pnpm和yarn 的区别
包管理工具是JavaScript开发中不可或缺的一部分，它们可以帮助我们方便地安装、更新、删除和管理项目所依赖的各种库和模块。目前，最流行的包管理工具有npm、yarn和pnpm，它们各有各的特点和优劣势。本文将试着对这三个工具进行全面的对比。
2024-01-03 17:37:39
1303
原创 Vue3 + 百度地图实现位置选择，获取地址经纬度
API文档地址：https://lbsyun.baidu.com/index.php?API文档地址：https://lbsyun.baidu.com/index.php?示例地址：https://lbsyun.baidu.com/index.php?示例地址：https://lbsyun.baidu.com/index.php?API文档地址：https://lbsyun.baidu.com/index.php?示例地址：https://lbsyun.baidu.com/jsdemo.htm。
2023-09-08 17:05:52
5534
7
原创 Pinia基础及使用方法
简单来说，Pinia是vueX的新版本，我们都知道Vuex在Vue2中主要充当状态管理的角色，所谓状态管理，就是一个存储数据的地方，存放在Vuex中的数据在各个组件中都能访问到，它是Vue生态中重要的组成部分。在Vue3中，可以使用传统的Vuex来实现状态管理，也可以使用最新的pinia来实现状态管理。Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。Pinia和Vuex的作用是一样的，它也充当的是一个存储数据的作用，存储在pinia的数据也允许我们在各个组件中使用。
2023-08-22 16:15:00
1709
原创 Vue3 的ref和reactive的用法和区别
ref和reactive是Vue3中用来实现数据响应式的API，一般情况下，ref定义基本数据类型，reactive定义引用数据类型。
2023-08-01 15:07:20
1901
原创 Vue3 项目实战 — Vue3记账本项目（前端Vue3，后端node.js）
本项目为高仿微信记账本 H5 项目（微信记账本是小程序），项目页面不多，但是涵盖了很多数据操作知识。使用 Vue3、Vite4、Pinia、Vant 当前主流技术栈开发。
2023-07-31 16:50:48
1040
1
原创 vue3 封装ECharts组件
前端开发需要经常使用ECharts图表渲染数据信息，在一个项目中我们经常需要使用多个图表，选择封装ECharts组件复用的方式可以减少代码量，增加开发效率。
2023-04-26 17:35:39
5616
5
原创 JavaScript中常用的数组方法
JavaScript中常用的数组方法文章目录前言 一、pandas是什么？ 二、使用步骤 1.引入库 2.读入数据 总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分
2023-02-14 09:51:36
345
原创 vue组件间的通信方式
一、组件间通信的概念组件是 vue 最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互进行直接的引用，所以组件间的相互通信是非常重要的。通信指的是发送者通过某种媒体以某种格式来传递信息到收信者以达到某个目的。广义上，任何信息的交通都是通信。组件间通信即指组件(.vue)通过某种方式来传递信息以达到某个目的。二、组件间通信的分类组件间通信的分类可以分成以下：父子组件之间的通信兄弟组件之间的通信跨代组件之间的通信非关系组件间之间的通信三、组件间通信的方案
2023-02-02 18:53:00
586
原创 JavaScript进阶之DOM(二)
六、排他操作1.排他思想如果有同一组元素，我们想要某一个元素实现某种样式， 需要用到循环的排他思想算法： 所有元素全部清除样式（干掉其他人） 给当前元素设置样式 （留下我自己） 注意顺序不能颠倒，首先干掉其他人，再设置自己 代码实现： <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> .
2021-10-01 23:09:43
340
1
原创 JavaScript进阶之DOM(一)
JavaScript进阶之DOM(一)目录总览一、 Web API介绍1.API的概念 API是一些预先定义的函数。 无需理解其内部工作机制细节，只需直接调用使用即可。 例如，javascript中函数alert()，2 .Web API的概念 Web API 是浏览器提供的一套操作浏览器功能和页面元素的 API ( BOM 和 DOM )。 MDN 详细 API : https://developer.mozilla.org/zh-CN/docs/Web/
2021-09-07 22:33:15
249
原创 JavaScript基础总结（2）
JavaScript基础总结（2）六、数组与函数数组1. 数组的概念一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。2. 创建数组 利用new关键字创建数组； var数组名=newArray([n]);//[]代表可选若写n，则代表数组的长度vararr=newArray();//创建了一个名为arr的空数组 利用数组字面量创建数组 //...
2021-08-26 22:54:25
809
3
原创 JavaScript基础总结（1）
JavaScript基础总结（1）一、编程基础编程基础计算机语言：可以分为机器语言，汇编语言，高级语言。计算机内部最终执行的都是机器语言，由“0”和“1”组成的二进制数，二进制是计算机语言的基础。数据存储单位：8bit(比特) = 1B(Byte)字节 千字节1KB = 1024B翻译器：高级语言编写的程序不能被计算机识别，需要经过转换，将源代码程序翻译成机器语言才能运行。浏览器里面的js解释器就是这样的一个翻译器。程序运行:打开某个程序时，先从硬盘中把程序的代码加载到内存中.
2021-08-25 23:48:46
401
原创 Web前端之CSS基础总结(2)
Web前端之CSS基础总结(2)六、CSS三大特性1. CSS 层叠性-概念： 所谓层叠性是指多种CSS样式的叠加 是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉 -原则： 样式冲突，遵循的原则是就近原则。那个样式离着结构近，就执行那个样式。 样式不冲突，不会层叠。 2. CSS 继承性-概念： 子标签会继承父标签的某些样式，如文本颜色和字号。 想..
2021-08-25 00:17:28
674
原创 Web前端之CSS基础总结(1)
1、CSS介绍 概念：层叠样式表或者级联样式表(Cascading Stylr Sheets) 层叠;CSS特性 CSS作业：设置网页结构的样式（改变html标签的样式），通过CSS给HTML标签设置属性到改变样式 CSS书写位置介绍： * 内嵌式写法:书写在HTML的head位置 <style type="text/css">书写CSS代码</style> * 外链式写法 * 行...
2021-08-22 22:49:47
474
原创 Web前端之HTML标签总结
一、HTML基本原理网页的原理：用户输入网址之后，对应的服务器就发现有人请求我的网页了，所以这个服务器就会把网页和相关的图片、js文件、css文件、flash文件都通过HTTP协议传输到用户的电脑里面。HTML页面在用户的电脑里面进行渲染。HTTP协议指的是超文本传输协议。每一个网址，都对应了服务器上面的确定的文件。纯文本文件：只有内容，没有样式。常见的纯文本文件有：.txt、.html、.js、.css、.java。没有语义，即使你这个文件中的内容排版再清晰，那也是人认为的，实际上纯文本文件中的所
2021-08-14 22:14:55
513
原创 微信小程序--分包加载流程
微信小程序--分包加载流程1.为什么要分包小程序要求压缩包体积不能大于 2M，否则无法发布 实际开发中小程序体积如果大于 2M 就需要使用分包机制进行发布上传 分包后可解决 2M 限制，并且能分包加载内容，提高性能 分包后单个包的体积不能大于 2M 分包后所有包的体积不能大于 16M 2.分包形式常规分包 独立分包 分包预下载 3.常规分包1. 开发者通过在 app.json subpackages 字段声明项目分包结构 ...
2021-08-08 00:16:05
2603
原创 微信小程序--video组件实现视频弹幕功能
微信小程序播放视频有相应的组件来实现，我们只需要调用即可，video组件的部分参数如下图：完整参数见微信小程序官方文档PS：相关属性解析：danmu-list:弹幕列表 enable-danmu:是否显示弹幕 danmu-btn:弹幕按钮 controls:是否显示视频控件接下来是实现小程序视频实时弹幕功能，主要分为两个部分，播放视频和发送弹幕1. 播放视频视频video的wxml结构如下所示：<video class="video" id="danmuc...
2021-07-24 14:59:12
7388
4
原创 微信小程序--简易计算器
一、项目概述本文主要介绍了微信小程序的一个简易计算器的实现代码实例。实现的功能有：实现简单的加减乘除 删除 全部清空小程序页面目录如下：计算器页面如下：二、WXML文件编写首先我们对计算器页面进行设计，这里我们主要分为两部分，上部为结果显示，下部为按键部分分为操作数和操作符。计算器分为五行四列，采用弹性显示结构，横向显示。布局通过样式表操作，WXML代码如下：...
2021-07-19 21:33:11
20607
4
原创 微信小程序登陆注册功能实现
一、前言我们在开发小程序时，经常会用到登陆注册功能。小程序有为我们提供用户授权登陆的功能，但是这个功能只能获取用户的头像和昵称，我们通常需要的是实现小程序账号密码的注册和登陆，本文是一个简单的小程序登陆注册功能的开发。我们实现的功能有1. 账号密码登陆2.账号密码注册3.退出登陆二、原理讲解因为我们账号密码的注册，就是把用户设置的账号密码存到数据库里，登陆也是从数据库里取账号和密码来校验。所以我们必须要有数据库。如果用传统的数据库来做，比较麻烦，所以我们今天就借助小程序云开发数据库来做。三、
2021-07-14 14:43:17
21800
9
原创 微信小程序关闭调试器警告sitemap的解决办法
我们在微信开发者助手开发小程序时，在调试时经常会出现警告sitemap，多页面程序时点击页面一次出现一次警告sitemap，很影响其他数据的显示。下面是关闭警告sitemap的方法我们只需要打开project.config.json，在setting下面增加“checkSiteMap”: false 即可，如下图所示：...
2021-07-11 13:50:23
2255
原创 基于ESP32的智能家居控制系统-微信小程序界面
一、 课题研究意义、现状及应用分析1.1课题研究意义及现状目前，科学技术发展十分迅速，其渗透到各行各业以及生活的方方面面，室内设计和高科技结合便出现了“智能家居”。所谓智能家居就是以居住场所为平台，利用物联网、传感器、智能控制技术将各种家用电器联系起来，实现居住环境的智能化、自动化、人性化。通过语音控制、远程控制、预约控制、个性化设计、一键控制等功能进一步提高生活的舒适性、便利性、安全性。1.2应用分析具体而言，利用多种传感器监测室内温度、湿度、光线强度、烟雾浓度、室内是否有人等信息自动调整空调、加
2021-07-05 17:47:49
15922
7
原创 微信小程序展示弹窗的方式
微信小程序中展示弹窗有四种方式：showToast、showModal、showLoading、showActionSheet具体参数可参照微信开发文档1. wx.showToast<!-- index.wxml --><!-- wx.showToast(消息提示框) --><button bindtap="handleShowToast">ShowToast</button>// index.jsPage({ handleShowToas
2021-07-04 11:24:04
9487
原创 微信小程序slot插槽的使用方法---单插槽和多插槽
1. slot的简单介绍组件的插槽是为了让我们封装的组件更具有扩展性，让使用者可以决定组件内部的一些内容到底展示什么。例如购物网站中的搜索导航栏，他们都有相同的部分，我们可以保留它们相同的部分，只需要给他们不相同的部分定义一个插槽即可。2. 单个插槽的使用方法（1）封装组件，创建slot组components/my-slot/my-slot，并在my-slot.wxml中写好插槽的内容。<!--components/my-slot/my-slot.wxml--><view&g
2021-07-03 16:09:45
1909
2
原创 Mixly第三方库开发——OLED库
** 前言**Mixly自从2015年问世以来，就深受国内创客、中小学教师喜爱，如今已经成为国内最好用的Arduino图形化软件。Mixly最大的优点就是其开放性，Mixly建立了一个生态圈，这个生态圈欢迎所有人的加入，不限制厂家，不限制硬件。因此，任何一个掌握规则的人都可以为Mixly开发第三方库，来丰富Mixly的功能。Mixly基本原理Mixly可以看作是介于普通用户与Arduino IDE之间桥梁，通过这个桥梁，即使用户不懂C语言的语法，也可以利用图形化程序编写Arduino程序。Mixly的
2021-05-19 19:35:54
2608
1
原创 Mind+实现自定义用户库——TM1637数码管
Mind+实现自定义用户库——TM1637数码管前言Mind+内置支持上百种常见的传感器库，并从V1.6.2开始，开放用户库，任何用户均可以制作和分享自己的用户库，并提供了本地及网络加载方式，方便大家的使用。本博客实现的是Mind+实现自定义用户库——TM1637数码管，在Mind+软件上利用ESP32（可以是其他板子）驱动TM1637数码管显示数字或时间。Mind+自定义用户库详细教程参考官网教程：官方链接????本博客利用Mind+提供的用户库模板快速制作TM1637数码管用户库。以下是操作步
2021-05-11 23:15:15
2854
1
原创 ESP8266连接DHT11收集数据上传微信小程序实现实时温湿度监测
ESP8266连接DHT11收集数据上传微信小程序实现实时温湿度监测一、原理讲解原理简述：利用发布订阅模式。第一步，先读取DHT11温湿度数值，第二步，新建主题，然后ESP8266往这个主题发送消息，第三步。小程序通过HTTP API接口获取数据。小程序控制原理：ESP8266订阅了一个主题，小程序往这个主题发控制消息，ESP8266就可以收到消息，就可以执行相关控制指令了（开/关函数）程序讲解：在本示例中，ESP8266 有两个角色，一个是temp(DHT11传感器数据)主题消息的发布者，ESP82
2021-05-09 22:19:57
4619
1
原创 飞桨PaddleHub实现将视频转化为皮影戏
一、前言PaddleHub是飞桨生态下的预训练模型的管理工具，旨在让飞桨生态下的开发者更便捷地享受到大规模预训练模型的价值。用户可以通过PaddleHub便捷地获取飞桨生态下的预训练模型，结合Fine-tune API快速完成迁移学习到应用部署的全流程工作，让预训练模型能更好服务于用户特定场景的应用。通过PaddleHub提供的人体骨骼关键点检测库，完成人体骨骼关键点检测，将人体骨骼关键点进行连接，就可以获取到人体的肢体骨骼，同时映射到皮影身上，就可以得到皮影人了；将视频中连续帧进行转换，就可以实现皮影
2021-05-06 22:52:50
287
原创 进阶篇-基于掌控板和EMQ X Cloud平台实现响应式web对接物联网MQTT应用
进阶篇-基于掌控板和EMQ X Cloud平台实现响应式web对接物联网MQTT应用前言：本文是上篇文章基于掌控板和SIoT平台实现响应式web对接物联网MQTT应用的进阶版本，上篇文章的MQTT服务受限于局域网，无法通过外网来完成Web端远程控制设备，本项目将MQTT服务器搭建在EMQ X Cloud平台，将不在受限于局域网，只要把搭建好的网站放到自己的服务器上，不管何时何地都能在Web端来远程控制设备。一、EMQ X Cloud平台的配置和响应式Web端代码编写本项目的亮点可以制作个性化的响应式
2021-04-26 20:57:15
484
2
原创 基于掌控板和SIoT平台实现响应式web对接物联网MQTT应用
基于掌控板和SIoT平台实现响应式Web对接物联网MQTT应用SIoT 是一款简单易用的 MQTT 服务器软件，也是“虚谷物联”项目的核心软件之一。SIoT 不用安装，也不用注册、设置，一键运行后，其他物联网设备（如掌控板）按照一定的规范接入即可正常使用。正因为这一点，SIoT 得到创客老师们的热捧，成为中小学物联网教学的重要支撑软件。本项目基于掌控板和SIoT平台实现了响应式web对接物联网，可以在远程Web端来进行设备的开关。一、SIoT的工作流程SIoT 运行后，会启动两种网络服务，一是 MQ
2021-04-25 22:38:13
751
原创 Arduino结合掌控版使用Mind+平台上云
Arduino结合掌控版使用Mind+平台上云项目简介在Mind+平台上对Arduino提供了丰富的传感器库支持，但使用arduino采集数据后想把数据却无法上传到阿里云平台，因为Mind+上没有Arduino相关的网络服务，无法实现上云，支持上云的掌控板却又只有屈指可数的传感器。本项目提供了一种方案，即使用arduino来采集数据，然后通过串口将数据发送到掌控板，再利用掌控板接收数据并上传到阿里云，从而实现数据转发及上云。本项目分为四个部分：arduino采集温度数据串口转发和接受数据掌控板
2021-04-22 20:39:13
1303
2
原创 如何用mind+制作一个语音小助手
要求：用mind+的实时模式来制作一个语音小助手来进行语音对话，可以实现语音问答，语音学习。前者指的是用户可以与语音智能小助手形成问答的形式，语音学习，后者语音学习的指的是采取机自我学习的形式，即语音智能小助手对我我们提出的问题进行学习，并且录取我们的答案，然后添加到列表当中。实验步骤：步骤1：官方教程开始前，先去mind+官网看下教程，至于老师讲的啥，反正已经忘光了，要想靠谱，还得自己自学。里给大家介绍下，mind+官网有详细的教程，以及常见的问题解决，非常的全面。建议小伙伴们在玩mind+的
2021-04-22 10:12:26
3884
原创 vue.js 知识点（三）
vue和react相同，都是单项数据流，也就是只能从父组件流向子组件，但是因为根据引用的不同，子组件也是可以经过函数处理流向父组件的！这点跟react十分相似，但是也有不同：react：父组件流向子组件是直接在子组件引用中添加props，子组件可以接收到props内容；子组件更改父组件需要使用函数更改vue：父组件流向子组件通过在数据data（）{ *** ，return 数据}，子组件在接收到props的内容； 子组件更改父组件可以通过on和on和on和emit来更改主要来总结一下，子组件传递数据
2021-04-21 15:15:39
81
记账本前端代码（vue3版本）
2023-12-06
基于物联网的智慧农业监测系统web端后端代码（node.js版本）
2023-11-07
记账本前端资源（uniapp版本）
2023-10-07
基于物联网的智慧农业监测系统的arduino硬件端代码
2022-06-07
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人