观澜0068-CSDN博客

原创 Day 12｜组合式函数 Composables：把重复逻辑抽成可复用的“乐高块

本文详解Vue 3组合式函数（Composable）的实战应用，通过将列表页共用逻辑（如加载、分页、防抖搜索）封装为useList等可复用函数，实现代码大幅精简。强调命名规范（以use开头）、调用时机（仅在setup中同步调用）及响应式处理原则，避免状态共享陷阱。结合useDebounceValue、useLocalStorage等实用工具，提升开发效率与维护性，真正掌握Composition API核心精髓。

2026-10-24 08:04:24 323

原创 Day 11｜Axios 请求封装：把本地数组换成真实接口（含拦截器、重试、取消重复请求）

本文详解如何将前端项目从本地数据过渡到真实HTTP请求，核心是使用Axios封装可复用、可调试的API层。通过创建实例、配置baseURL与环境切换，结合请求/响应拦截器实现自动带token、全局loading、统一错误处理及401自动登出。进一步将请求逻辑抽离为独立API模块，组件仅关注业务。实践了取消重复请求（AbortController/序号校验）、幂等请求重试、Mock适配器与CORS调试技巧，并与Pinia状态管理深度联动，实现全站loading、通知与用户状态同步。附完整单文件示例，零构建、无

2026-10-23 18:07:17 153

原创 Day 10｜Pinia 状态管理：把散落在各组件的数据，收进一个全局仓库

本文详解Vue项目中引入Pinia解决状态管理痛点。通过对比props传递、事件总线等方案的局限，展示Pinia作为全局响应式数据中心的优势：支持state、getters、actions三要素，实现跨组件数据共享与同步。文章手把手演示CDN快速集成、store定义、响应式解构（storeToRefs）、异步action及高级方法（$patch、$reset、$subscribe），帮助开发者告别“属性钻探”，构建可维护、易调试的大型Vue应用。

2026-10-22 20:53:29 173

原创 Day 9｜Vue Router：把单页后台拆成能跳转的多页面

今天通过 Vue Router 实现了单页应用（SPA）的后台路由系统，用 hash 模式实现无构建、零后端的多页面切换：通过路由表绑定路径与组件，配合 router-link 实现菜单跳转，router-view 作为内容出口，动态路由参数 :id 支持商品详情页，状态不丢失。完整代码可复制即用，打造可交互的 MiniMall 后台框架。

2026-10-21 21:30:00 609

原创 Day 7｜TypeScript 基础：给 JavaScript 装上“类型安全带

TypeScript 是 JS 的超集，不改变运行本质，只在保存时做编译期类型检查，提前拦截多数报错。本教程讲解基础类型、数组与元组、联合与交叉类型、接口、函数、泛型、类与访问修饰符，并提醒慎用 any、开启 strict 模式等新手坑，附 MiniMall 商品管理器和次日 Vue3 预告。

2026-10-21 11:27:54 138

原创 Day 8｜Vue3 响应式：告别手动操作 DOM，让数据驱动界面

本文通过一个零构建的Vue3 MiniMall商品面板，演示了响应式原理与核心API：ref/reactive实现数据驱动视图，v-model完成双向绑定，v-for高效渲染列表，computed与watch处理逻辑，组件化封装提升复用性。全程无需构建工具，仅靠CDN即可运行，直观展现“数据变更，界面自动更新”的现代前端开发范式。

2026-10-20 08:04:46 253

原创 Day 6｜ES6+ 语法：把现代 JS 写顺手，从解构到 map / filter / reduce

本文系统梳理ES6+核心语法：解构、展开、map/filter/reduce、Promise/async-await、模块化与class，聚焦“列表数据”处理，通过MiniMall看板实战演示如何用链式操作实现订单统计、分组排序等复杂逻辑。代码零框架、可直接运行，助力前端开发从“能跑”迈向“好读好维护”。

2026-10-18 22:22:36 392

原创 Day 5｜JavaScript 基础：让页面“活“起来，从变量到事件

这是一篇面向前端新手、以"商城 MiniMall"为线索的 JavaScript 入门教程，用"知识点讲解 + 完整可运行示例 + 动手任务"的结构，把 JS 基础语法、DOM/事件、表单校验和调试串成一套实战。

2026-10-17 18:20:42 237

原创 Day 4｜响应式布局与移动端适配：一套代码同时跑在手机和 PC

本文详解响应式网页设计核心技巧：以“移动优先”为原则，通过viewport设置、流体布局（%、vw、fr）、clamp()实现流体排版与间距，结合min-width断点媒体查询优化多端适配。重点解决手机上导航挤爆、图片过大、字体过小等问题，强调无需为移动端单独写代码。文中提供完整index.html示例，展示页面随屏幕宽度自适应的“流动”效果，涵盖响应式图片、安全区处理、100dvh等现代实践，助力一套代码跨设备流畅呈现。

2026-10-17 10:00:00 252

原创 Day 3｜Flex 与 Grid 布局：不再写 float，也不再算百分比

本文详解Flex与Grid布局的核心区别与应用场景：Flex适用于一维布局（如导航、卡片内部），Grid则擅长二维布局（如商品列表、仪表盘）。通过“外层Grid搭骨架，内层Flex排细节”的组合模式，实现高效响应式布局。文中提供六大经典场景代码，涵盖居中、侧栏、标签云等，告别传统float+margin的繁琐写法，仅用两行CSS即可完成复杂页面结构，附完整示例可直接运行体验。

2026-10-15 19:05:31 337

原创 Day 2｜CSS 盒模型：把昨天的骨架，变成能看的页面

本文系统讲解前端布局核心——盒模型，涵盖四层结构（content、padding、border、margin）及关键属性box-sizing: border-box的实战应用。通过解析常见坑点（外边距折叠、宽度爆炸、inline-block空白），结合display、overflow、单位选择等实用技巧，帮助开发者精准控制布局，实现响应式与美观并重的页面效果。附完整代码可直接运行验证。

2026-10-15 09:00:00 647

原创 Day 1｜HTML5：一个商城首页的骨架，从 DOCTYPE 到语义化

本文深入浅出讲解HTML核心概念：它作为标记语言，仅负责内容语义。从文档结构、语义化标签（如<header>、<main>）、文本与列表标签，到图片、链接、表格、表单及多媒体嵌入，全面解析如何用正确标签构建可读、可访问、利于SEO的网页。文末附完整index.html，复制即用，实践掌握所有基础标签。

2026-10-13 23:45:00 611

原创 MosMos 创意效果与能力边界展示

在创意落地的过程中，最让人头疼的往往不是缺乏想法，而是无法将脑海中模糊的画面快速转化为可视化的成果。很多设计师和创作者都经历过这样的时刻：面对空白画布，明明有一个绝妙的概念，却卡在风格尝试、细节打磨或是反复修改的漫长周期里。传统的绘图工具虽然强大，但学习成本高、操作繁琐，对于需要快速验证灵感或批量产出素材的场景来说，显得力不从心。这时候，一个能够理解复杂指令、快速生成多风格高质量图像的 AI 引擎，就成了打破瓶颈的关键。MosMos 正是为了解决这一痛点而生的核心创意引擎。

2026-09-19 16:57:11 421

原创第 10 篇：深入浅出学 Java 语言（JDK8 版）—— 掌握包机制，实现 Java 代码的规范组织与管理

创建包：需保证package语句与目录结构严格一致，公共类名与文件名一致；使用包：按使用频率选择完全限定名、单个导入或整个包导入，冲突时用完全限定名解决；管理文件：源文件与类文件可分开存放，通过类路径让编译器/JVM 找到类；规范命名：用反转域名作为前缀，全小写，处理特殊域名时添加下划线。掌握包机制后，你能轻松应对中小型 Java 项目的代码组织，后续学习 Spring、MyBatis 等框架时，也能快速理解框架的包结构（如），为企业级项目开发打下规范基础。

2025-09-12 15:32:21 787

原创第 9 篇：深入浅出学 Java 语言（JDK8 版）—— 吃透泛型机制，筑牢 Java 类型安全防线

Java泛型通过参数化类型，解决了非泛型代码中的运行时类型错误和强制类型转换冗余问题。泛型在编译时提供更强的类型检查，消除强制类型转换，并支持编写类型无关的通用算法。泛型类和接口通过类型参数定义，如Box<T>和Pair<K,V>，实例化时指定具体类型。泛型方法通过方法级类型参数实现通用逻辑，适用于静态和非静态方法。JDK7+的菱形语法简化了泛型实例化。泛型的核心优势在于将类型错误提前到编译时，提升代码复用性和稳定性，为集合框架和通用组件开发奠定基础。

2025-09-12 15:09:31 853

原创第 8 篇：深入浅出学 Java 语言（JDK8 版）—— 吃透数字与字符串，精通 Java 基础数据操作

本文深入讲解Java中数字与字符串两大核心数据类型的处理。在数字处理方面，介绍了包装类(Number子类)的作用及自动装箱拆箱机制，解析了数字格式化的两种方式(printf/format和DecimalFormat)，并详细说明Math类提供的数学计算方法。在字符串处理方面，重点阐述了String类的不可变性、常用操作方法，以及与StringBuilder的性能差异。通过JDK8代码示例，帮助开发者掌握Java基础数据转换、格式化与操作的核心能力，为数据处理打下坚实基础。

2025-09-12 14:45:57 841

原创第7篇：深入浅出学 Java 语言（JDK8 版）—— 吃透接口与继承，构建 Java 类的层级与契约

本文深入讲解Java面向对象编程中的接口与继承两大核心机制。接口作为"行为契约"，定义了类必须实现的方法规范，支持多实现并通过默认方法解决兼容性问题；继承则通过类层级结构实现代码复用，子类可继承父类成员并重写方法。文章详细介绍了接口的四种成员（常量、抽象方法、默认方法、静态方法），接口实现与演进的最佳实践，以及继承的基本规则和多态应用。通过汽车操作、自行车类等示例，帮助读者掌握如何利用接口解耦、通过继承复用代码，构建灵活可扩展的Java类结构。

2025-09-12 14:18:19 1028

原创第 6 篇：深入浅出学 Java 语言（JDK8 版）—— 吃透注解机制，掌握 Java 元数据编程

摘要：本文深入解析 Java 注解机制，从元数据本质出发，揭示注解的三大核心用途：编译检测、代码生成和运行时检查。详解注解格式（无元素/带元素/多注解共存）及 JDK8 新增的类型注解使用场景（如泛型参数标注）。重点讲解自定义注解的声明方法，通过 @interface 定义元素并配合元注解控制行为。最后剖析 JDK8 预定义注解（如 @Deprecated、@Override）的实用场景，为框架学习奠定元数据编程基础。全文结合代码示例，系统化呈现注解的语法规范与实践价值。

2025-09-12 11:38:56 1020

原创第 5 篇：深入浅出学 Java 语言（JDK8 版）—— 精通类与对象进阶，掌握 Java 面向对象核心能力

Java 类与对象进阶指南本文深入讲解 Java 面向对象编程中类与对象的核心概念，涵盖类的完整定义（字段、方法、构造函数）、对象的实例化与使用、访问控制、this 关键字、static 成员、嵌套类、Lambda 表达式及枚举类型。通过 Bicycle 等示例代码，详解封装原则、对象生命周期、垃圾回收机制和初始化方式。重点解析静态嵌套类与内部类的区别，以及如何通过嵌套类实现逻辑分组和增强封装。适合 Java 初学者系统掌握面向对象编程的核心能力。

2025-09-12 10:46:01 834

原创《JavaSE 全版本精讲系列：从 JDK8 到 JDK24 的基础、进阶与实战》之 “JDK8 篇

简介：作为入门首篇，先介绍 Java 技术的核心优势与应用场景，让初学者建立初步认知；再以 JDK8 为基准，详细分步讲解 Java 开发软件的下载、安装流程，搭配截图标注关键步骤，解决新手 “安装难” 的问题。

2025-09-12 10:28:47 333

原创第 4 篇：深入浅出学 Java 语言（JDK8 版）—— 吃透语言基础，搭建 Java 编程骨架

Java 语言基础看似简单，但却是后续学习类与对象、集合、框架的前提——比如变量的作用域会影响对象的使用，控制流逻辑会决定业务代码的正确性。这一章的知识点，建议多写代码实践：比如用不同循环实现同一个需求，对比哪种更简洁；故意漏掉break看switch的穿透效果，直观感受语法规则。接下来，你可以尝试把前面学的“类与对象”和“语言基础”结合起来——比如给Bicycle。

2025-09-12 10:23:02 937

原创第 3 篇：深入浅出学 Java 语言（JDK8 版）—— 吃透类与对象，筑牢面向对象编程根基

本文深入浅出地讲解了Java面向对象编程的核心概念，通过自行车案例生动诠释类与对象的关系。文章首先以自行车为例，展示如何定义Bicycle类（包含状态字段和行为方法）并创建具体对象实例，强调对象状态的独立性。随后介绍继承机制，通过MountainBike子类扩展父类功能，演示代码复用和方法重写。最后讲解接口概念，以Rideable接口规范骑行行为，说明JDK8新增的默认方法特性。全文结合JDK8代码示例，帮助初学者理解类、对象、继承、接口等面向对象基础，为Java编程打下坚实基础。

2025-09-12 09:09:17 1026

原创第 2 篇：Java 入门实战（JDK8 版）—— 编写第一个 Java 程序，理解基础运行逻辑

本文是一份Java 8开发入门指南，详细介绍了如何在IntelliJ IDEA中创建和运行第一个"Hello World"程序。主要内容包括：Java 8 JDK和IDEA的安装配置；创建Java项目的方法；编写HelloWorld类代码的技巧；程序运行的多种方式；命令行编译运行的验证步骤；以及常见问题的解决方案。文章着重解析了代码结构，包括类定义、main方法的作用和System.out.println输出语句的含义，帮助初学者理解Java程序的基本组成。同时提供了IDEA的实用技巧，

2025-09-11 11:31:14 1257

原创第 1 篇：Java 入门指南（JDK8 版）—— 认识 Java 技术，手把手教你安装开发环境

【Java新手入门指南】本文首先解释了Java的核心概念：既是编程语言又是跨平台软件平台，通过JVM实现"一次编写，到处运行"。接着详细介绍JDK8的安装步骤：下载64位版本、设置无中文空格的安装路径、配置JAVA_HOME和CLASSPATH环境变量。还提供了java -version命令验证安装成功的方法。文章强调Java对新手友好，语法简单且提供丰富API工具，适合开发图形界面、数据库应用等程序。最后建议新手完成安装后尝试第一个HelloWorld程序，为后续学习打下基础。

2025-09-10 11:56:24 817

原创解决RuoYi-Cloud项目ruoyi-system模块启动失败问题以及Naco容器部署问题

总之记住一点，配置好Nacos，并且将Mysql数据库中的ry-config中的配置数据加载进去就成功了。（我的文章写的比较粗糙，并且每个人的环境不一样，利用AI完成Nacos配置就好。

2025-08-10 19:42:38 1543

原创 Nacos 容器化部署控制台访问问题解决方案（含 v2.x 与 v3.x 双版本对比）

摘要：本文针对Nacos容器化部署中的控制台404访问问题，对比分析了v2.x与v3.x版本的差异与解决方案。v2.x控制台使用8848端口且默认关闭鉴权，而v3.x拆分为独立8080端口并强制鉴权，需配置NACOS_AUTH_TOKEN等参数。提供了两版本的完整Docker部署命令及常见问题排查方法，重点说明v3.x鉴权参数的生成步骤（Base64编码密钥与身份键值对）。最后强调分布式环境需保持密钥一致性，并给出安全建议。通过版本特性对比表（端口、鉴权等）帮助用户快速适配不同部署场景。

2025-06-23 15:22:56 4186 3

原创 ABP微服务架构中网关层NullReferenceException问题解析与HTTP配置优化

本文分析了ABP微服务架构中网关层常见的NullReferenceException问题及解决方案。问题主要表现为网关层控制器依赖服务实例为null，异常堆栈指向微服务接口调用处。临时解决方案是注释app.UseConfiguredEndpoints()绕过路由系统，但这会带来功能失效隐患。正确的解决方法是采用构造函数注入和正确注册服务。同时文章详细介绍了开发环境下将HTTPS转为HTTP的配置方法，包括修改Ocelot配置、Kestrel设置、launchSettings调整等步骤，并强调了认证授权服务的

2025-06-17 11:51:21 1256

原创 abp.swagger.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)

若ABP脚本存放于非wwwroot目录（如staticFileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "static")), // 自定义目录RequestPath = "/static" // 请求路径前缀（如通过/static/abp.js访问）});在.NET 8中，ABP框架的静态资源（如abp.js）必须通过显式启用中间件才能正常访问。

2025-06-04 11:55:21 824

原创 C#数组与集合

本文介绍了C#中数组和集合的基本操作与使用方法。首先，数组部分涵盖了定义、初始化、访问、修改、切片、遍历、多维数组、锯齿数组以及常用数组方法。接着，集合部分详细介绍了ArrayList、List<T>、SortedList<TKey, TValue>、LinkedList<T>、Dictionary<TKey, TValue>、Queue<T>和Stack<T>等常用集合类型及其操作。最后，通过一个综合练习项目模板展示了数组与集合的实际

2025-05-16 11:44:09 465

原创 C#控制流

C# 中的控制流语句是程序逻辑的核心，用于根据条件或循环执行代码块。常见的控制流结构包括 if、else if、else 用于条件判断，switch 用于多分支选择，while 和 do...while 用于循环执行，for 和 foreach 用于遍历集合，以及 continue 用于跳过当前迭代。每种结构都有其特定的应用场景，如 if 适用于简单的条件判断，switch 适合多分支选择，for 和 foreach 则常用于遍历数组或集合。通过合理使用这些控制流语句，可以编写出结构清晰、逻辑严谨的代码。

2025-05-16 11:26:52 519

原创 C#运算符

C# 运算符按类别分为一元、算术、赋值、比较、逻辑、按位、条件、空相关、Lambda 表达式、对象创建、访问、类型信息、范围与索引等。常用运算符包括 +, -, *, /, %, ==, !=, &&, ||, ?:, ??, ?., new, typeof, is, as 等。示例代码展示了如何使用这些运算符，如一元运算符 ++、--，算术运算符 +、%，逻辑运算符 &&、||，以及空值处理运算符 ??、?. 等。此外，还介绍了运算符优先级和关联规则，强调使用括号可以改变优

2025-05-16 10:52:44 1213

原创 C#数据类型

C# 提供了多种数据类型和结构，包括布尔值、整数、浮点数、枚举、元组、字符串、数组、日期时间等。布尔值表示逻辑值 true 或 false，整数类型包括有符号和无符号的多种类型，如 int、long 等。浮点数类型有 float、double 和 decimal，分别用于不同精度的数值计算。枚举用于定义一组命名的整数常量，元组则用于组合多个值。字符串和字符分别用于处理文本和单个字符，数组用于存储相同类型的多个元素。日期时间类型 DateTime 和 TimeSpan 用于处理日期和时间间隔。C# 还支持类型

2025-05-15 22:21:53 1202

原创 C#语法基础

.NET 平台是由 Microsoft 支持的免费开源应用程序平台，支持跨平台开发，涵盖 Android、Apple、Linux 和 Windows 等操作系统。其核心编程语言是 C#，它是一种安全、面向对象的现代语言，支持高级功能如面向数据的记录，以及低级功能如函数指针。.NET 平台提供标准库和 API，覆盖从集合、网络到机器学习的广泛领域，并通过 NuGet 包管理器管理超过 300000 个包。开发工具包括 .NET CLI、Visual Studio 和 Visual Studio Code，支持

2025-05-15 22:07:19 1256

原创 Windows10系统RabbitMQ无法访问Web端界面

项目场景：在一个基于 .NET 的分布式项目中，团队使用 RabbitMQ 作为消息队列中间件，负责模块间的异步通信。开发环境为 Windows 10 系统，开发人员按照官方文档安装了 RabbitMQ 和 Erlang，但在安装完成后，尝试通过浏览器访问 RabbitMQ 的 Web 管理界面（默认地址：http://localhost:15672）时，发现页面无法加载，提示无法访问该网站。同时，.NET 项目中的 RabbitMQ 客户端也无法正常连接，导致消息队列功能异常。

2025-04-16 21:41:52 2069

原创 C#基础类型系统-接口

【代码】C#基础类型系统-接口。

2025-04-10 14:31:28 358

原创 C#编程语言简介

编写一个程序，计算半径为 2.50 厘米的圆的面积。请记住，圆的面积公式是半径的平方乘以 π。，它们也可以在字符串中搜索子字符串。这些方法分别用于查找字符串开头或结尾的子字符串。语句和循环结构，试着编写 C# 代码来计算从 1 到 20 的所有可以被 3 整除的整数之和。在测试字符串末尾的文本时，请注意标点符号。如果字符串以句号结尾，则必须检查以句号结尾的字符串。您应该得到一个介于 19 和 20 之间的答案。命名空间中定义的一个常量，其类型为。，您可以使用它来表示 π 的值。，在字符串的末尾搜索。

2025-04-07 14:57:20 741

Vue的介绍使用以及说明

git笔记，介绍了git的使用以及原理

空空如也