当前位置: 首页 > news >正文

【JavaEE】实现简单博客系统-前端部分

文件目录:在这里插入图片描述

展示:

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

blog_list.html:

<!DOCTYPE html>
<html lang="cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>博客列表页</title><link rel="stylesheet" href="css/common.css"><link rel="stylesheet" href="css/blog_list.css">
</head>
<body><!-- 导航栏 --><div class="nav"><img src="image/灯塔.jpg" alt=""><div class="title">我的博客系统</div><div class="spacer"></div><a href="blog_list.html">主页</a><a href="blog_edit.html">写博客</a><a href="">注销</a></div><!-- 页面主体 --><div class="container"><div class="container-left"><div class="card"><img src="image/goat.png" alt=""><h3>Ethan</h3><a href="https://github.com/">github地址</a><div class="counter"><span>文章</span><span>分类</span></div><div class="counter"><span>2</span><span>1</span></div></div></div><div class="container-right"><div class="blog"><div class="title">我的第一篇博客</div><div class="date">2023-11-6 12:00:00</div><div class="desc">从今天起, 我要认真敲代码. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Debitis repellendus voluptatum, reiciendis rem consectetur incidunt aspernatur eveniet excepturi magni quis sint, provident est at et pariatur dolorem aliquid fugit voluptatem.</div><a href="blog_detail.html?blogId=1">查看全文 &gt;&gt;</a></div><div class="blog"><div class="title">我的第二篇博客</div><div class="date">2023-11-6 12:00:00</div><div class="desc">从今天起, 我要认真敲代码. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Debitis repellendus voluptatum, reiciendis rem consectetur incidunt aspernatur eveniet excepturi magni quis sint, provident est at et pariatur dolorem aliquid fugit voluptatem.</div><a href="blog_detail.html?blogId=1">查看全文 &gt;&gt;</a></div></div></div>
</body>
</html>

blog_detail.html:

<!DOCTYPE html>
<html lang="cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>博客详情页</title><link rel="stylesheet" href="css/common.css"><link rel="stylesheet" href="css/blog_detail.css">
</head>
<body><!-- 导航栏 --><div class="nav"><img src="image/灯塔.jpg" alt=""><div class="title">我的博客系统</div><div class="spacer"></div><a href="blog_list.html">主页</a><a href="blog_edit.html">写博客</a><a href="">注销</a></div><!-- 页面主体 --><div class="container"><div class="container-left"><div class="card"><img src="image/goat.png" alt=""><h3>Ethan</h3><a href="https://github.com/">github地址</a><div class="counter"><span>文章</span><span>分类</span></div><div class="counter"><span>2</span><span>1</span></div></div></div><div class="container-right"><h3>这是我的第一篇博客</h3><div class="date">2023-11-6 13:00:00</div><div class="content"><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae nulla, at deleniti rem ratione libero natus! Repellat totam pariatur eligendi cum quo. Eum ex similique, nemo facere minus vel est!</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam aliquid esse soluta rem accusamus? Distinctio numquam qui beatae quos eveniet tenetur. Corrupti dolorem, id molestiae dolores facilis quos hic architecto.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere nihil alias unde ratione, quis, quam soluta atque eligendi quasi labore aliquam autem tenetur repellat? Amet ducimus iste perferendis a adipisci.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae nulla, at deleniti rem ratione libero natus! Repellat totam pariatur eligendi cum quo. Eum ex similique, nemo facere minus vel est!</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam aliquid esse soluta rem accusamus? Distinctio numquam qui beatae quos eveniet tenetur. Corrupti dolorem, id molestiae dolores facilis quos hic architecto.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere nihil alias unde ratione, quis, quam soluta atque eligendi quasi labore aliquam autem tenetur repellat? Amet ducimus iste perferendis a adipisci.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae nulla, at deleniti rem ratione libero natus! Repellat totam pariatur eligendi cum quo. Eum ex similique, nemo facere minus vel est!</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam aliquid esse soluta rem accusamus? Distinctio numquam qui beatae quos eveniet tenetur. Corrupti dolorem, id molestiae dolores facilis quos hic architecto.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere nihil alias unde ratione, quis, quam soluta atque eligendi quasi labore aliquam autem tenetur repellat? Amet ducimus iste perferendis a adipisci.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae nulla, at deleniti rem ratione libero natus! Repellat totam pariatur eligendi cum quo. Eum ex similique, nemo facere minus vel est!</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam aliquid esse soluta rem accusamus? Distinctio numquam qui beatae quos eveniet tenetur. Corrupti dolorem, id molestiae dolores facilis quos hic architecto.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere nihil alias unde ratione, quis, quam soluta atque eligendi quasi labore aliquam autem tenetur repellat? Amet ducimus iste perferendis a adipisci.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae nulla, at deleniti rem ratione libero natus! Repellat totam pariatur eligendi cum quo. Eum ex similique, nemo facere minus vel est!</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam aliquid esse soluta rem accusamus? Distinctio numquam qui beatae quos eveniet tenetur. Corrupti dolorem, id molestiae dolores facilis quos hic architecto.</p><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere nihil alias unde ratione, quis, quam soluta atque eligendi quasi labore aliquam autem tenetur repellat? Amet ducimus iste perferendis a adipisci.</p></div></div></div>
</body>
</html>

login.html:

<!DOCTYPE html>
<html lang="cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>博客登录页</title><link rel="stylesheet" href="css/common.css"><link rel="stylesheet" href="css/login.css">
</head>
<body><!-- 导航栏 --><div class="nav"><img src="image/灯塔.jpg" alt=""><div class="title">我的博客系统</div><div class="spacer"></div><a href="blog_list.html">主页</a><a href="blog_edit.html">写博客</a><!-- <a href="">注销</a> --></div><div class="login-container"><div class="login-dialog"><h3>登录</h3><form action=""><div class="row"><span>用户名</span><input type="text" id="username"></div><div class="row"><span>密码</span><input type="text" id="password"></div><div class="row"><input type="submit" id="submit" value="登录"></div></form></div></div>
</body>
</html>

blog_edit.html:

<!DOCTYPE html>
<html lang="cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>博客编辑页</title><link rel="stylesheet" href="css/common.css"><link rel="stylesheet" href="css/blog_edit.css"><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script><!-- 引入 editor.md 的依赖 --><link rel="stylesheet" href="editor.md/css/editormd.min.css" /><script src="editor.md/lib/marked.min.js"></script><script src="editor.md/lib/prettify.min.js"></script><script src="editor.md/editormd.js"></script>
</head>
<body><!-- 导航栏 --><div class="nav"><img src="image/灯塔.jpg" alt=""><div class="title">我的博客系统</div><div class="spacer"></div><a href="blog_list.html">主页</a><a href="blog_edit.html">写博客</a><a href="">注销</a></div><div class="blog-edit-container"><from action=""><div class="title"><input type="text" id="title-input"><input type="submit" id="submit"></div><div id="editor"></div></from></div><script>var editor = editormd("editor", {// 这里的尺寸必须在这里设置. 设置样式会被 editormd 自动覆盖掉. width: "100%",// 设定编辑器高度height: "calc(100% - 50px)",// 编辑器中的初始内容markdown: "# 在这里写下一篇博客",// 指定 editor.md 依赖的插件路径path: "editor.md/lib/"});</script></body>
</html>

common.css:

/* 公共的样式 */
* {box-sizing: border-box;padding: 0;margin: 0;
}
html {height: 100%;
}body {background-image: url("../image/小船.jpg");background-repeat: no-repeat;background-position: center center;background-size: cover;height: 100%;
}/* 导航栏 */
.nav {width: 100%;height: 50px;background-color: rgba(0, 0, 0, 0.5);color: white;display: flex;align-items: center;
}
.nav title {font-size: 30px;color: white;
}
.nav img {width: 40px;height: 40px;margin-left: 30px;margin-right: 30px;border-radius: 20px;
}
.nav a {color: white;text-decoration: none;padding: 0 10px;
}
.nav .spacer {width: 70%;
}
.container {width: 1000px;margin: 0 auto;height: calc(100% - 60px);display: flex;justify-content: space-between;
}
.container-left {height: 100%;width: 200px;
}
.container-right {height: 100%;width: 795px;background-color: rgba(255,255,255,0.8);border-radius: 10px;padding: 20px;overflow: auto;
}
.card {background-color: rgba(255, 255, 255, 0.8);border-radius: 10px;padding: 30px;
}
.card h3 {text-align: center;padding: 10px;
}
.card img {width: 140px;height: 140px;border-radius: 70px;
}
.card a {text-align: center;color: gray;text-decoration: none;display: block;margin-bottom: 10px;
}
.card .counter {display: flex;padding: 5px;justify-content: space-around;
}

blog_list.css:

.blog {padding: 20px;
}
.blog .title{font-size: 22px;text-align: center;font-weight: 900;
}
.blog .date {text-align: center;color: rgb(0, 128, 0);padding: 15px 0;
}
.blog,.desc {text-indent: 2em;
}
.blog a {/* 改成块级元素, 此时才能够设置尺寸 */display: block;width: 150px;height: 40px;border: 2px solid black;/* 把里面的文字改一下颜色, 和下划线 */color: black;text-align: center;text-decoration: none;/* 当文字的行高和元素高度一样的时候, 文字恰好是垂直居中的 */line-height: 40px;/* 水平居中 */margin: 10px auto;/* 加上背景切换的过渡效果, all 表示针对所有的变化都进行过渡. 2s 意思是过渡的时间是 2s */transition: all 0.4s;
}
.blog a:hover {background-color: gray;color: white;
}

blog_detail.css:

.container-right h3 {font-size: 22px;text-align: center;font-weight: 900;padding: 10px 0px;
}
.container-right .date {text-align: center;color: green;padding: 10px 0;}
.container-right .content {text-indent: 2em;margin-bottom: 5px;
}

login.css:

.login-container {width: 100%;height: calc(100% - 50px);display: flex;justify-content: center;align-items: center;
}
.login-dialog {width: 500px;height: 350px;background-color: rgba(255, 255, 255, 0.8);border-radius: 10px;
}
.login-dialog h3 {font-size: 24px;font-weight: 900;text-align: center;margin: 40px 0;
}
.login-container .row {height: 50px;width: 100%;display: flex;justify-content: space-around;align-items: center;
}
.row span {font-size: 20px;width: 60px;
}
.row #username {width: 400px;height: 40px;   font-size: 22px;text-indent: 10px;
}
.row #password {width: 400px;height: 40px; font-size: 22px;text-indent: 10px;
} 
.row #submit {width: 150px;height: 40px;color: white;background-color: rgb(0, 145, 255);text-align: center;line-height: 40px;border: none;border-radius: 10px;}
.row #submit:hover{background-color: gray;
}

blog_edit.css:

.blog-edit-container {width: 1000px;height: calc(100% - 50px);margin: 0 auto;
}
.blog-edit-container .title {height: 50px;display: flex;justify-content: space-between;align-items: center;}
/* 标题的输入框 */
#title-input {height: 40px;width: 900px;border-radius: 10px;border: none;font-size: 20px;text-indent: 10px;margin: 10px;
}/* 提交按钮 */
#submit {height: 40px;width: 100px;border-radius: 10px;border: none;color: white;background-color: orange;
}#submit:hover {background-color: gray;
}.blog-edit-container form {height: 100%;
}#editor {border-radius: 10px;/* background-color: rgba(255, 255, 255, 0.8); *//* 这个也是设置半透明. 会让子元素也跟着一起半透明 */opacity: 80%;
}
.blog-edit-container from {height: 100%;
}

相关文章:

【JavaEE】实现简单博客系统-前端部分

文件目录&#xff1a; 展示&#xff1a; blog_list.html: <!DOCTYPE html> <html lang"cn"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><t…...

首发scitb包,一个为制作统计表格而生的R包

目前&#xff0c;本人写的第3个R包scitb包已经正式在R语言官方CRAN上线&#xff0c;scitb包是一个为生成专业化统计表格而生的R包。 可以使用以下代码安装 install.packages("scitb")scitb包对我而言是个很重要的R包&#xff0c;我的很多想法需要靠它做平台来实现&a…...

2023-11-06 LeetCode每日一题(最大单词长度乘积)

2023-11-06每日一题 一、题目编号 318. 最大单词长度乘积二、题目链接 点击跳转到题目位置 三、题目描述 给你一个字符串数组 words &#xff0c;找出并返回 length(words[i]) * length(words[j]) 的最大值&#xff0c;并且这两个单词不含有公共字母。如果不存在这样的两个…...

numpy机器学习深度学习 常用函数

Python numpy(np)创建空的字符串数组、矩阵。解决数组中每个元素仅保留单个字符&#xff0c;无法完整填入字符串。 matrix1np.zeros(shape(31,22)).astype(np.str_) matrix1[matrix1 0.0] 1.reshape()方法 作用是将数据按照指定的维度重新组织并返回。也就是reshape&#x…...

连接器切断机维修

目录 起因 机器出现的问题排查 问题 检查 维修方法 今天也开始了设备的维修记录&#xff0c;今天出问题的是连接器切断器的维护&#xff01; 起因 “连接器切断机坏了&#xff0c;有没有维修的&#xff0c;机器不动了&#xff0c;没有报警&#xff0c;没有断电和气管的泄漏&…...

Mysql数据库 8.SQL语言 外键约束

一、外键约束 外键约束——将一个列添加外键约束与另一张表的主键&#xff08;唯一列&#xff09;进行关联之后&#xff0c;这个外键约束的列添加的数据必须要在关联的主键字段中存在 案例 创建原则&#xff1a;先创建不含外键的表也就是班级表 添加外键的方式 一般使用第一…...

ERROR in static/js/xxx.js from UglifyJs Unexpected token name «currentVersion»

添加链接描述 ERROR in static/js/xxx.js from UglifyJs Unexpected token name currentVersion, expected punc 遇到这种异常, 需要运行下面脚本运行npm i -D uglifyjs-webpack-pluginbeta修改webpack.prod.conf.jsjs中引入参数const UglifyJsPlugin require(uglifyjs-webpa…...

反序列化 [网鼎杯 2020 青龙组]AreUSerialz 1

打开题目 <?phpinclude("flag.php");highlight_file(__FILE__);class FileHandler {protected $op;protected $filename;protected $content;function __construct() {$op "1";$filename "/tmp/tmpfile";$content "Hello World!&qu…...

JWT登录校验

工作原理 下面来详细看看 UTF-8 是如何工作的&#xff0c;以及为什么它会根据被编码的字符具有不同的长度。 一、JWT是什么&#xff1f; 在介绍JWT之前&#xff0c;我们先来回顾一下利用token进行用户身份验证的流程&#xff1a; 1、客户端使用用户名和密码请求登录 2、服务端…...

python发送企业微信群webhook消息(文本、文件)

import datetime import os import time from copy import copyimport requests from loguru import logger from urllib3 import encode_multipart_formdataclass WeiXin_Robot:def __init__(self,url: str ""):# 测试cartest_url "https://qyapi.weixin.qq.…...

高数笔记06:无穷级数

图源&#xff1a;文心一言 时间比较紧张&#xff0c;仅导图~~&#x1f95d;&#x1f95d; 第1版&#xff1a;查资料、画导图~&#x1f9e9;&#x1f9e9; 参考资料&#xff1a;《高等数学 基础篇》武忠祥 &#x1f433;目录 &#x1f433;常数项级数 &#x1f40b;概要 &…...

Android工具栏ToolBar

主流APP除了底部有一排标签栏外&#xff0c;通常顶部还有一排导航栏。在Android5.0之前&#xff0c;这个顶部导航栏以ActionBar控件的形式出现&#xff0c;但AcionBar存在不灵活、难以扩展等毛病&#xff0c;所以Android5.0之后推出了ToolBar工具栏控件&#xff0c;意在取代Aci…...

2.3 - 网络协议 - ICMP协议工作原理,报文格式,抓包实战

「作者主页」&#xff1a;士别三日wyx 「作者简介」&#xff1a;CSDN top100、阿里云博客专家、华为云享专家、网络安全领域优质创作者 「推荐专栏」&#xff1a;对网络安全感兴趣的小伙伴可以关注专栏《网络安全入门到精通》 ICMP协议 1、ICMP协议工作原理2、ICMP协议报文格式…...

北京陪诊小程序|陪诊系统开发|陪诊小程序未来发展不可小觑

近几年随着互联网快速发展&#xff0c;各行业领域都比较注重线上服务系统&#xff0c;通过陪诊小程序开发可以满足更多用户使用需求&#xff0c;同时还能提高用户使用体验。现在陪诊类的软件应用得到全面推广&#xff0c;在医疗行业当中陪诊小程序更贴近用户生活&#xff0c;可…...

前端面试题总结(一)

1. vue性能优化 v-if和v-show使用&#xff1a;频繁切换使用v-show&#xff08;display样式&#xff09;&#xff0c;反之使用v-if&#xff08;删除与新值DOM&#xff09;v-for必须加key&#xff0c;不能使用index当作key&#xff08;使用index&#xff0c;如果数组发生变化&am…...

LeetCode107. Binary Tree Level Order Traversal II

文章目录 一、题目二、题解 一、题目 Given the root of a binary tree, return the bottom-up level order traversal of its nodes’ values. (i.e., from left to right, level by level from leaf to root). Example 1: Input: root [3,9,20,null,null,15,7] Output: […...

【大模型应用开发教程】04_大模型开发整体流程 基于个人知识库的问答助手 项目流程架构解析

大模型开发整体流程 & 基于个人知识库的问答助手 项目流程架构解析 一、大模型开发整体流程1. 何为大模型开发定义核心点核心能力 2. 大模型开发的整体流程1. 设计2. 架构搭建3. Prompt Engineering4. 验证迭代5. 前后端搭建 二、项目流程简析步骤一&#xff1a;项目规划与…...

【Unity ShaderGraph】| 快速制作一个 表面水纹叠加效果

前言 【Unity ShaderGraph】| 快速制作一个 表面水纹叠加效果一、效果展示二、表面水纹叠加效果三、应用实例 前言 本文将使用ShaderGraph制作一个表面水纹叠加效果&#xff0c;可以直接拿到项目中使用。对ShaderGraph还不了解的小伙伴可以参考这篇文章&#xff1a;【Unity Sh…...

大模型的实践应用5-百川大模型(Baichuan-13B)的模型搭建与模型代码详细介绍,以及快速使用方法

大家好,我是微学AI,今天给大家介绍一下大模型的实践应用5-百川大模型(Baichuan-13B)的模型搭建与模型代码详细介绍,以及快速使用方法。 Baichuan-13B 是由百川智能继 Baichuan-7B 之后开发的包含 130 亿参数的开源可商用的大规模语言模型,在权威的中文和英文 benchmark 上均…...

用友U8定制版在集简云:无需API即可集成客服系统和用户运营

无代码开发的新时代 在这个信息化、自动化的时代&#xff0c;无代码开发已经成为一种新的趋势。集简云就是这样的一款工具&#xff0c;可以轻松连接用友U8 定制版与近千款软件系统&#xff0c;无需开发、无需代码知识就可以打通各种软件之间的数据连接&#xff0c;构建自动化与…...

超短脉冲激光自聚焦效应

前言与目录 强激光引起自聚焦效应机理 超短脉冲激光在脆性材料内部加工时引起的自聚焦效应&#xff0c;这是一种非线性光学现象&#xff0c;主要涉及光学克尔效应和材料的非线性光学特性。 自聚焦效应可以产生局部的强光场&#xff0c;对材料产生非线性响应&#xff0c;可能…...

STM32标准库-DMA直接存储器存取

文章目录 一、DMA1.1简介1.2存储器映像1.3DMA框图1.4DMA基本结构1.5DMA请求1.6数据宽度与对齐1.7数据转运DMA1.8ADC扫描模式DMA 二、数据转运DMA2.1接线图2.2代码2.3相关API 一、DMA 1.1简介 DMA&#xff08;Direct Memory Access&#xff09;直接存储器存取 DMA可以提供外设…...

大模型多显卡多服务器并行计算方法与实践指南

一、分布式训练概述 大规模语言模型的训练通常需要分布式计算技术,以解决单机资源不足的问题。分布式训练主要分为两种模式: 数据并行:将数据分片到不同设备,每个设备拥有完整的模型副本 模型并行:将模型分割到不同设备,每个设备处理部分模型计算 现代大模型训练通常结合…...

听写流程自动化实践,轻量级教育辅助

随着智能教育工具的发展&#xff0c;越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式&#xff0c;也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建&#xff0c;…...

MySQL:分区的基本使用

目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区&#xff08;Partitioning&#xff09;是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分&#xff08;分区&#xff09;可以独立存储、管理和优化&#xff0c;…...

AI语音助手的Python实现

引言 语音助手(如小爱同学、Siri)通过语音识别、自然语言处理(NLP)和语音合成技术,为用户提供直观、高效的交互体验。随着人工智能的普及,Python开发者可以利用开源库和AI模型,快速构建自定义语音助手。本文由浅入深,详细介绍如何使用Python开发AI语音助手,涵盖基础功…...

什么是VR全景技术

VR全景技术&#xff0c;全称为虚拟现实全景技术&#xff0c;是通过计算机图像模拟生成三维空间中的虚拟世界&#xff0c;使用户能够在该虚拟世界中进行全方位、无死角的观察和交互的技术。VR全景技术模拟人在真实空间中的视觉体验&#xff0c;结合图文、3D、音视频等多媒体元素…...

学习一下用鸿蒙​​DevEco Studio HarmonyOS5实现百度地图

在鸿蒙&#xff08;HarmonyOS5&#xff09;中集成百度地图&#xff0c;可以通过以下步骤和技术方案实现。结合鸿蒙的分布式能力和百度地图的API&#xff0c;可以构建跨设备的定位、导航和地图展示功能。 ​​1. 鸿蒙环境准备​​ ​​开发工具​​&#xff1a;下载安装 ​​De…...

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

上位机开发过程中的设计模式体会(1):工厂方法模式、单例模式和生成器模式

简介 在我的 QT/C 开发工作中&#xff0c;合理运用设计模式极大地提高了代码的可维护性和可扩展性。本文将分享我在实际项目中应用的三种创造型模式&#xff1a;工厂方法模式、单例模式和生成器模式。 1. 工厂模式 (Factory Pattern) 应用场景 在我的 QT 项目中曾经有一个需…...