Vue3中常用的APIref、reactive​ Vue 3 的响应式系统是其能够自动更新视图的基石。当修改一个响应式数据时，Vue 能够追踪到这个变化，并自动重新渲染依赖于这个数据的组件部分。ref 和 reactive 就是创建这种响应式数据的两种主要方式 reactive reactive() 是 Vue 3 提供的用于创建响应式对象的函数 它接收一个普通的 JavaScript 对象（或数组），并返回该对象的响应式代理（Proxy） 12345678910import { reactive } from 'vue';const state = reactive({ count: 0, user: { name: 'Alice', age: 30 }, hobbies: ['reading', 'music']}); 现在，对 state 的任何修改都会触发响应式更新 1234// 所有这些都是响应式的state.co ...

懒加载（滚动加载） 在我们平常的开发中，我们会加载一些列表数据，这些数据的加载会影响到页面的加载速度，导致用户的等待时间变长，影响用户的体验 所以很多数据量比较大的列表数据都会有翻页的功能，但是翻页会让用户多一些操作，影响用户的体验 所以有一种懒加载的方式就是滚动加载，当用户滚动到列表的底部时，再加载下一页的数据，这样可以避免一次性加载所有数据，导致页面的加载速度变慢，同时也减少了用户的操作，提升了用户的交互体验 平时我常用的滚动加载主要是传统 scroll 监听，但是最近深入研究了一下这个，发现还有其他的方法来实现滚动加载 基本原理无论用哪种方法，逻辑都差不多： 监听滚动事件（scroll 或 IntersectionObserver） 判断是否接近底部 触发加载函数 请求数据并渲染 直到数据加载完成 两种常见实现方式方式一：传统 scroll 监听12345678910111213141516171819202122232425262728293031<div id="list" style="height: 400px; overflow ...

Express&Koa2ExpressExpress的基本使用1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071const express = require("express");// 1.创建express的服务器const app = express();/* express提供给我们的中间件 在客户端发送post请求时，会将数据放到body中 客户端可以通过json的方式传递，也可以通过form表单的方式传递 - x-www-form-urlencoded - 是一种在 HTTP 请求中用于编码表单数据的方式。它是默认的表单数据编码类型， 特别是在通过 HTML 表单提交数据时，如果表单的 enctype 属性没有被显式指定为其他值，那么就会使用 application/x-w ...

Content-Type的深度解析Content-Type 是 HTTP 协议中的核心头部字段，用于标识传输数据的媒体类型（MIME 类型），确保客户端和服务端能正确解析和处理数据。以下从定义、结构、类型、应用场景及最佳实践等方面系统性介绍： 一、基本概念与作用 定义Content-Type 遵循 MIME（Multipurpose Internet Mail Extensions）标准，最初用于电子邮件系统，后扩展至 HTTP 协议。其格式为 主类型/子类型; 参数，例如 text/html; charset=UTF-8。 核心作用• 请求端：告知服务器如何解析请求体的数据格式（如 JSON、表单数据等）。 • 响应端：指示客户端（如浏览器）如何解析返回的数据（如渲染 HTML、下载文件等）。 • 兼容性：通过标准化类型减少数据解析错误，提升跨平台兼容性。 二、语法结构与参数 语法规则 1Content-Type: type/subtype ;parameter=value • 主类型（type）：大类标识，如 text、image、application。 • 子类型 ...

测试测试

Picgo与MinIO搭建图床 此篇文章需要先搭建MinIO服务，若是还没搭建此服务，可以参考笔者往期的文章。 PicGo 是一款开源免费的桌面工具，能快速将本地图片上传到云图床（如GitHub、七牛云等），并自动生成网络链接，支持拖拽、剪贴板上传，兼容Windows/macOS/Linux，可与Typora等编辑器无缝集成，大幅简化写作、博客等场景的图片插入流程。 1.下载Picgo并安装 Picgo是一款开源的工具，所以我们可以直接访问相应的 GitHub 地址进行下载 Molunerfinn/PicGo: :rocket:A simple & beautiful tool for pictures uploading built by vue-cli-electron-builder ，这里我是下载的最新版，如果想要稳定，可以下载相对老的一些版本。 下载完成后进行安装，安装过程中没有什么需要配置的地方，无脑下一步即可。 2.下载Node环境PicGo 是基于 electron 开发的图片上传工具，它内置插件系统以提供更强大的功能 ...

Minio 部署 MinIO 是一款开源的高性能分布式对象存储系统，专为云原生环境设计，完美兼容 Amazon S3 API，支持存储图片、视频、日志等非结构化数据（单对象最大 5TB）。其核心优势包括： 极简部署：单节点仅需 512MB 内存，支持 Docker 一键部署，30 秒内可快速搭建私有云存储； 企业级可靠性：通过纠删码技术实现数据冗余（允许半数节点故障自动修复），并具备 Bitrot 保护机制实时检测/修复数据损坏； 生态融合：无缝集成 Kubernetes、Spark 等工具，且提供细粒度权限控制与审计日志，适用于 AI/ML 训练、数据湖、灾备等场景。作为轻量级 S3 替代方案，MinIO 在标准硬件上可达 183GB/s 的读写性能，是构建混合云存储的理想选择。 当然，笔者部署Minio是为了替代OSS服务来支持我的图床服务，由于我的服务器配置比较低（2核2g），所以这里就不展示使用Docker的部署方案了。 1.创建文件目录首先在 /home 文件夹下创建一个 project 文件夹，然后在此文件夹下继续创建一个名叫 min ...

Git 安装无脑下一步 配置name和email 12git config --global user.name "earstrive"git config --global user.email "1491157227@qq.com" 使用git 查看当前仓库状态 1git status 初始化仓库 1git init 文件状态 未跟踪 刚刚添加到项目中的文件处于未跟踪状态 已跟踪 暂存 未修改 已修改 未跟踪 —> 暂存 12git add <filename> # 将文件切换到暂存状态git add * # 将所有已修改（未跟踪）的文件暂存 暂存 —> 未修改 12git commit -m "xxxx" # 将暂存的文件存储到仓库中git commit -a -m "xxxx" # 提交所有已修改文件（未跟踪的文件不会提交） 未修改 —> 修改 修改代码后，文件会变为修改状态 查看记录 1git log Git提交的常 ...

Cesium开始 创建Vue项目 安装Cesium：npm install cesium 将node_modules中的cesium目录下的Build/Cesium中4个目录拷贝到public中 组件中编写代码 1234567891011121314151617181920212223242526272829303132333435<script setup>import * as Cesium from "cesium";import "cesium/Build/Cesium/Widgets/widgets.css";import { onMounted } from "vue";// 设置cesium tokenCesium.Ion.defaultAccessToken ="你的token";// 设置cesium静态资源目录window.CESIUM_BASE_URL = "lib/cesium";onMounted(() => ...