vue2 切换主题色以及单页面好使方法
今天要新增一个页面要根据不同公司切换不同页面主题色,一点一点来,怎么快速更改 el-pagination 分页组件主题色。
<el-pagination :page-size="pageSize" :pager-count="pageCount"layout="sizes, prev, pager, next, jumper, ->, total, slot" :total="total">
</el-pagination>
默认样式是这样的
现在变成红色主题
<style lang="scss">
.el-pagination {.el-pager li.active {color: #de194d;cursor: default;}.el-pager li:not(.disabled):hover {color: #de194d;}button.btn-next:not(:disabled) .el-icon-arrow-right:not(.disabled):hover {color: #de194d;}button.btn-prev:not(:disabled) .el-icon-arrow-left:not(.disabled):hover {color: #de194d;}button.btn-prev:not(:disabled):hover {color: #de194d;}button.btn-next:not(:disabled):hover {color: #de194d;}.el-input__inner:hover {border-color: #de194d !important;}.el-input__inner:focus {border-color: #de194d !important;}.el-select .el-input.is-focus .el-input__inner {border-color: var(--theme-color);}
}.el-select-dropdown__item.selected {color: #de194d;
}
</style>
当然 style 不能加 scoped ,可以当独加一个不带 scoped 的 style。
如果加 scoped 用下面这种方式
<style lang="scss" scoped>
::v-deep.el-pagination {.el-pager li.active {color: #de194d;cursor: default;}.el-pager li:not(.disabled):hover {color: #de194d;}button.btn-next:not(:disabled) .el-icon-arrow-right:not(.disabled):hover {color: #de194d;}button.btn-prev:not(:disabled) .el-icon-arrow-left:not(.disabled):hover {color: #de194d;}button.btn-prev:not(:disabled):hover {color: #de194d;}button.btn-next:not(:disabled):hover {color: #de194d;}.el-input__inner:hover {border-color: #de194d !important;}.el-input__inner:focus {border-color: #de194d !important;}.el-select .el-input.is-focus .el-input__inner {border-color: var(--theme-color);}
}::v-deep.el-select-dropdown__item.selected.hover {color: #de194d !important;font-size: 50px
}
</style>
<style>
.el-select-dropdown__item.selected {color: #de194d !important;
}
</style>
自己写太麻烦,element-ui 提供更换主题方法
建一个 theme.scss 文件
/* 改变主题色变量 */
$--color-primary: #f0a70b;/* 改变 icon 字体路径变量,必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';@import "~element-ui/packages/theme-chalk/src/index";
更改 main.js 注释 element-ui 样式的导入,改为 theme.scss。因为样式都是一样的,没有必要引入两次
// import 'element-ui/lib/theme-chalk/index.css';
import './theme.scss'
这是 element 组件可以简单设置更改,那么我自己写的组件怎么简单实现更改主题色呢?
vue2 可以 scss 的全局变量
在 src 目录新建全局变量文件 theme.scss
/* 改变主题色变量 */
$--theme-color: #e61111;
vue.config.js
module.exports = defineConfig({css: {loaderOptions: {scss: {additionalData: `@import "@/theme.scss";`}}}
})
路径一定要配置正确
然后页面就可以用 color: $--theme-color; 方式引用了。
另一种方式是使用 :root,:root 是一个伪类选择器,它用来匹配文档的根元素。在HTML文档中,:root 实际上总是指向 <html> 元素。:root 的主要用途是定义一个全局的CSS变量。
但是 :root 比设置 html 元素更好用,:root 是伪类选择器。html 是标签选择器。所以:root 的优先级大于 html。
theme.scss
/* 改变主题色变量 */
:root {--theme-color: #e61111;
}
引用
color: var(--theme-color);
更改主题色,在任一页面都可以,但不能设置 scoped 不然不好使
<style lang="scss">
:root {--theme-color: rgb(164, 240, 11);
}
</style>
但这有个问题,他会把全站的样式都变更了,后加载的 :root 会把父组件或是先设置的组件样式覆盖了,如果只想在当前页面变更主题色可能不行。
解决办法,可以在子组件根元素中重新设置全局变量值,这样就只会在子组件生效不会影响用 :root 的其它父组件和兄弟组件了。
.hello {
--theme-color: rgb(164, 240, 11);
--font-size: 25px;
}
<template><div class="hello" style="margin-top: 50px; width: 850px"><el-pagination:page-size="pageSize":pager-count="pageCount"layout="sizes, prev, pager, next, jumper, ->, total, slot":total="total"></el-pagination></div>
</template><script>
export default {name: "About",data() {return {currentPage: 1,pageSize: 10,pageCount: 9,total: 1000,};},
};
</script><style lang="scss" scoped>
.hello {--theme-color: rgb(164, 240, 11);--font-size: 25px;
}::v-deep.el-pagination {.el-pager li.active {color: var(--theme-color);cursor: default;}.el-pager li:not(.disabled):hover {color: var(--theme-color);}button.btn-next:not(:disabled) .el-icon-arrow-right:not(.disabled):hover {color: var(--theme-color);}button.btn-prev:not(:disabled) .el-icon-arrow-left:not(.disabled):hover {color: var(--theme-color);}button.btn-prev:not(:disabled):hover {color: var(--theme-color);}button.btn-next:not(:disabled):hover {color: var(--theme-color);}.el-input__inner:hover {border-color: var(--theme-color);}.el-input__inner:focus {border-color: var(--theme-color);}.el-select .el-input.is-focus .el-input__inner {border-color: var(--theme-color);}
}::v-deep.el-select-dropdown__item.selected.hover {color: var(--theme-color);font-size: 50px;
}
</style>
<style lang="scss">
.el-select-dropdown__item.selected {color: var(--theme-color);
}
</style>
那么现在假设根据不同公司进入这个子组件画面,怎么根据 props 值运用不同样式。
mounted() {const companyId = this.$route.query.companyId;if (companyId == 1) {document.querySelector(".hello").classList.add("company1");} else if (companyId == 2) {document.querySelector(".hello").classList.add("company2");}}<style lang="scss" scoped>.company1 {--theme-color: rgb(164, 240, 11);--font-size: 25px;}.company2 {--theme-color: rgb(240, 11, 11);--font-size: 25px;}
</style>
也可用下面这种方法直接设置 style
mounted() {const companyId = this.$route.query.companyId;if (companyId == 1) {document.querySelector(".hello").style.setProperty("--theme-color", "rgb(164, 240, 11)");document.querySelector(".hello").style.setProperty("-font-size", "25px");} else if (companyId == 2) {document.querySelector(".hello").style.setProperty("--theme-color", "rgb(240, 11, 11)");document.querySelector(".hello").style.setProperty("-font-size", "25px");}},<style lang="scss" scoped>.company1 {--theme-color: rgb(164, 240, 11);--font-size: 25px;}.company2 {--theme-color: rgb(240, 11, 11);--font-size: 25px;}
</style>
这样 url 参数 companyId 传不同的值,页面就会显示不同颜色。但是有些弹出层什么的直接放到 body 或 app 下面的。如果设置到 body 或 app 上会怎么样
放到 app 都不好使(注意这里是加了 scoped 不好使,如果加 scoped,跳转会影响其它页面)
const companyId = this.$route.query.companyId;if (companyId == 1) {document.querySelector("#app").classList.add("company1");} else if (companyId == 2) {document.querySelector("#app").classList.add("company2");}
下拉框样式没改过来
看源码发现下拉框 和 app 在同一级了,company2 设到 app 所以不好使
改为 body 下也不好使,组件切换时因为只是组件的显示或隐藏所以 body 和 app 的样式还在
解决方案一:可以在路由守卫里做处理,如果是当前子组件跳出那么就移除添加的样式。
router/index.js 路由文件
router.afterEach((to, from) => {if (from.path == '/about') {document.querySelector("body").classList.remove("company1");document.querySelector("body").classList.remove("company2");}
})
解决方案二:使用 .has 选择器
<template><div class="hello" style="margin-top: 50px; width: 850px"><el-pagination:page-size="pageSize":pager-count="pageCount"layout="sizes, prev, pager, next, jumper, ->, total, slot":total="total"></el-pagination></div>
</template>mounted() {const companyId = this.$route.query.companyId;if (companyId == 1) {document.querySelector("body").classList.add("company1");} else if (companyId == 2) {document.querySelector("body").classList.add("company2");}},<style lang="scss">
.company1:has(.hello) {--theme-color: rgb(164, 240, 11);--font-size: 25px;
}
.company2:has(.hello) {--theme-color: rgb(240, 11, 11);--font-size: 25px;
}
</style>
给 body 添加样式,用 .has(.hello) 使这个样式只有在有 class="hello" 的页面生效,.has(.hello) 意思是存在 .hello 的子组件生效,即使下拉框不是 .hello 的子元素也会生效。.hello 是当前子组件唯一拥有的。
解决方案二:根据不同 companyId 给组件绑定 class
<template class="childHas"><div :class="themeClass" style="margin-top: 50px; width: 850px"><el-pagination:popper-class="themeClass":page-size="pageSize":pager-count="pageCount"layout="sizes, prev, pager, next, jumper, ->, total, slot":total="total"></el-pagination></div>
</template>computed: {themeClass() {const companyId = this.$route.query.companyId;let child = "";if (companyId == 1) {child = "childHas1";} else if (companyId == 2) {child = "childHas2";}return child;},},<style lang="scss">
.childHas1 {--theme-color: rgb(164, 240, 11);--font-size: 25px;
}
.childHas2 {--theme-color: rgb(240, 11, 11);--font-size: 25px;
}
</style>
完美解决
相关文章:
vue2 切换主题色以及单页面好使方法
今天要新增一个页面要根据不同公司切换不同页面主题色,一点一点来,怎么快速更改 el-pagination 分页组件主题色。 <el-pagination :page-size"pageSize" :pager-count"pageCount"layout"sizes, prev, pager, next, jumper,…...
三层固定实体架构:高效实现图上的检索增强生成(RAG)
知识图谱正在成为跨各个领域组织和检索信息的强大工具。它们越来越多地与机器学习和自然语言处理技术相结合,以增强信息检索和推理能力。在本文中,我介绍了一种用于构建知识图谱的三层架构,结合了固定本体实体、文档片段和提取的命名实体。通过利用嵌入和余弦相似度,这种方…...
pnpm 与 npm 的核心区别
以下是 pnpm 与 npm 的核心区别总结,涵盖依赖管理、性能、安全性等关键维度: 1. 依赖存储机制 • npm: 每个项目的依赖独立存储于 node_modules,即使多个项目使用相同版本的包,也会重复下载和存储。例如,1…...
NVMe简介6之PCIe事务层
PCIe的事务层连接了PCIe设备核心与PCIe链路,这里主要基于PCIe事务层进行分析。事务层采用TLP传输事务,完整的TLP由TLPPrefix、TLP头、Payload和TLP Digest组成。TLP头是TLP中最关键的部分,一般由三个或四个双字的长度,其格式定义如…...
【C++详解】string各种接口如何使用保姆级攻略
文章目录 一、string介绍二、string使用构造函数析构函数赋值运算符重载string的遍历修改方法1、下标[]2、迭代器3、范围for 迭代器使用详解const迭代器反向迭代器(reverse) Capacity(容量相关)size/lengthmax_sizecapacityclear/emptyshrink_to_fit(缩容)reserve(扩…...
深入理解 requestIdleCallback:浏览器空闲时段的性能优化利器
requestIdleCallback 核心作用 requestIdleCallback 是浏览器提供的 API,用于将非关键任务延迟到浏览器空闲时段执行,避免阻塞用户交互、动画等关键任务,从而提升页面性能体验。 基本语法 const handle window.requestIdleCallback(callb…...
QML鼠标事件和按键事件
1 鼠标事件 1.1 MouseArea组件 在QML中,鼠标事件主要通过MouseArea元素处理,它是用于检测和响应鼠标交互的核心组件。常用属性 cursorShape: 光标形状acceptedButtons: 设置响应鼠标的哪些按键事件,默认为鼠标左键 Qt.LeftButton࿱…...
Animaster:一次由 CodeBuddy 主导的 CSS 动画编辑器诞生记
我正在参加CodeBuddy「首席试玩官」内容创作大赛,本文所使用的 CodeBuddy 免费下载链接:腾讯云代码助手 CodeBuddy - AI 时代的智能编程伙伴 起心动念:我想要一个动画编辑器 那天我突然想到,如果能有一个简单好用的 CSS 动画编辑…...
Git 版本控制系统入门指南
Git 版本控制系统入门指南 一、Git 基础概念 1. 什么是 Git? Git 是一个分布式版本控制系统,它可以: 跟踪文件变化协调多人协作管理代码版本支持离线工作保证数据完整性 2. Git 的特点 分布式架构快速分支操作完整历史记录数据完整性保…...
GitHub 趋势日报 (2025年05月16日)
本日报由 TrendForge 系统生成 https://trendforge.devlive.org/ 🌐 本日报中的项目描述已自动翻译为中文 📈 今日整体趋势 Top 10 排名项目名称项目描述今日获星总星数语言1TapXWorld/ChinaTextbookPDF教材。⭐ 4792⭐ 19814Roff2xming521/WeClone&…...
C/C++之内存管理
1. 内存分布 我们定义的变量对于电脑来说也叫数据,同时电脑也会把这些数据分为不同的类型,分别是局部数据,静态数据,全局数据,常量数据和动态申请数据。 在 C 中,各类数据存储位置如下: • 局…...
GitHub文档加载器设计与实现
文章结构: 目录 GitHub文档加载器设计与实现 引言 架构设计 主要组件 核心功能 文档加载流程 加载单个文件 加载目录内容 错误处理与健壮性 分支回退策略 文件类型和大小限制 安全性考虑 SSL证书验证 使用示例 基本使用 测试环境配置 最佳实践 结…...
历史数据分析——中证白酒
简介 中证白酒指数选取涉及白酒生产业务相关上市公司证券作为指数样本,为投资者提供更多样化的投资标的。 估值 中证白酒总体的PB是5.26,在过去十年间位于23.76%,属于较低的水平。 中证白酒总体的PE是20.13,在过去十年间,位于14.24%,属于较低的水平。 从估值的角度似…...
PHP8.0版本导出excel失败
环境:fastadmin框架,不是原版接手的项目。PHP8.0,mysql5.7. code // 创建一个新的 Spreadsheet 对象 $spreadsheet new Spreadsheet(); $worksheet $spreadsheet->getActiveSheet();// 设置表头 $worksheet->setCellValue(A1, ID); $worksheet…...
Seata源码—5.全局事务的创建与返回处理二
大纲 1.Seata开启分布式事务的流程总结 2.Seata生成全局事务ID的雪花算法源码 3.生成xid以及对全局事务会话进行持久化的源码 4.全局事务会话数据持久化的实现源码 5.Seata Server创建全局事务与返回xid的源码 6.Client获取Server的响应与处理的源码 7.Seata与Dubbo整合…...
mac-M系列芯片安装软件报错:***已损坏,无法打开。推出磁盘问题
因为你安装的软件在Intel 或arm芯片的mac上没有签名导致。 首先打开任何来源操作 在系统设置中配置,如下图: 2. 然后打开终端,输入: sudo spctl --master-disable然后输入电脑锁屏密码 打开了任何来源,还遇到已损坏…...
端到端自动驾驶系统实战指南:从Comma.ai架构到PyTorch部署
引言:端到端自动驾驶的技术革命 在自动驾驶技术演进历程中,端到端(End-to-End)架构正引领新一轮技术革命。不同于传统分模块处理感知、规划、控制的方案,端到端系统通过深度神经网络直接建立传感器原始数据到车辆控制…...
MoveIt Setup Assistant 在导入urdf文件的时候报错
在使用MoveIt Setup Assistant导入urdf文件的时候(load a urdf or collada robot model),找到urdf文件后MoveIt Setup Assistant闪退并报错: Warning: Ignoring XDG_SESSION_TYPEwayland on Gnome. Use QT_QPA_PLATFORMwayland to run on Wayland anyway…...
uniapp +vue +springboot多商家订餐系统
uniapp vue springboot多商家订餐系统,这个系统我整理调试的多商家,多用户的,多端小程序订餐系统,主要包含了uniapp小程序端,管理后台页面vue端,后台功能接口Springboot端,源码齐全,…...
docker迅雷自定义端口号、登录用户名密码
在NAS上部署迅雷,确实会带来很大的方便。但是目前很多教程都是讲怎么部署docker迅雷,鲜有将自定义配置的方法。这里讲一下怎么部署,并重点讲一下支持的自定义参数。 一、部署docker 在其他教程中,都是介绍的如下命令,…...
联想笔记本黑屏了,排线出问题还是静电
以下引用 联想电脑屏幕不亮,电源键和键盘灯均正常的解决办法(超简单)_拯救者屏幕不亮,键盘有电-CSDN博客 昨天正常关机后,今天一早来工位打开电脑,美美开始玩手机。 一会之后抬头屏幕是黑的,还以为自动息…...
uniapp -- uCharts 仪表盘刻度显示 0.9999999 这样的值问题处理。
文章目录 🍉问题🍉解决方案🍉问题 在仪表盘上,23.8变成了 23.799999999999997 🍉解决方案 formatter格式化问题 1:在 config-ucharts.js 或 config-echarts.js 配置对应的 formatter 方法 formatter: {yAxisDemo1: function (...
为 Spring Boot 应用程序构建 CI/CD 流水线
为 Spring Boot 应用程序创建构建/部署流水线涉及多个步骤,而 Jenkins 可以作为强大的工具来自动化这些流程。在本教程中,我们将指导您为托管在 GitHub 上的 Spring Boot 应用程序设置流水线,使用 Jenkins 构建该应用程序,并将其部…...
数值分析填空题速通
填空题速通 文章目录 填空题速通误差与误差传播均差插值与误差范数、赋范线性空间与内积、内积空间范数代数精度数值微分积分误差迭代方程与收敛阶微分方程数值解法的迭代公式与阶 误差与误差传播 例 设 a 1.414 a 1.414 a1.414, b − 0.576 b -0.576 b−0.57…...
day016-系统负载压力测试-磁盘管理
文章目录 1. 系统负载2. 模拟系统高负载2.1 模拟cpu负载2.2 模拟IO负载 3. 磁盘接口分类4. 思维导图 1. 系统负载 系统负载是衡量系统繁忙程度的指标负载值接近或超过cpu核心总数表示系统负载高负载高常见原因:1.占用cpu过多导致2.占用磁盘IO过多导致(I…...
DeepSeek指令微调与强化学习对齐:从SFT到RLHF
后训练微调的重要性 预训练使大模型获得丰富的语言和知识表达能力,但其输出往往与用户意图和安全性需求不完全匹配。业内普遍采用三阶段训练流程:预训练 → 监督微调(SFT)→ 人类偏好对齐(RLHF)。预训练阶段模型在大规模语料上学习语言规律;监督微调利用人工标注的数据…...
安全性(一):加密算法总结
一、加密算法分类总览 加密类型关键特性代表算法主要用途对称加密加解密使用同一个密钥DES、3DES、AES、SM4数据加密传输、存储非对称加密公钥加密,私钥解密(或反向)RSA、DSA、ECC、SM2密钥交换、数字签名、身份认证哈希算法不可逆摘要MD5、…...
DeepSeek 赋能军事:重塑现代战争形态的科技密码
目录 一、引言:AI 浪潮下的军事变革与 DeepSeek 崛起二、DeepSeek 技术原理与特性剖析2.1 核心技术架构2.2 独特优势 三、DeepSeek 在军事侦察中的应用3.1 海量数据快速处理3.2 精准目标识别追踪3.3 预测潜在威胁 四、DeepSeek 在军事指挥决策中的应用4.1 战场态势实…...
我司助力高校打造「智慧创新AI学习中心」
为推动AI教育融合跨领域应用,东吴大学于2025年4月举行「智慧创新AI学习中心」揭牌仪式,并宣布正式启动AI特色课程与教学空间建置计画。此次建置由我司协助整体教室空间与设备规划,导入最新NVIDIA GeForce RTX 50系列桌上型电脑,并…...
AI赋能把“杂多集合”转化为“理想集合”的数学建模与认知升级
AI赋能把“杂多集合”转化为“理想集合”的数学建模与认知升级 一、核心概念定义 杂多集合(Chaotic Set) 定义:元素间关系模糊、结构无序的集合 数学表达:C{x∣x∈X,P(x)},其中 P(x) 是模糊隶属函数 实例…...
NVC++ 介绍与使用指南
文章目录 NVC 介绍与使用指南NVC 简介安装 NVC基本使用编译纯 C 程序编译 CUDA C 程序 关键编译选项示例代码使用标准并行算法 (STDPAR)混合 CUDA 和 C 优势与限制优势限制 调试与优化 NVC 介绍与使用指南 NVC 是 NVIDIA 提供的基于 LLVM 的 C 编译器,专为 GPU 加速…...
Redis 事务与管道:原理、区别与应用实践
在现代分布式系统开发中,Redis 作为高性能的内存数据库,其事务处理和管道技术是开发者必须掌握的核心知识点。本文将深入探讨 Redis 事务和管道的实现原理、使用场景、性能差异以及最佳实践,帮助开发者根据实际需求选择合适的技术方案。 一、…...
Git 多人协作
目录 情景一 情景二 合并分支 情景一 目标:远程 master 分支下的 file.txt 文件新增代码 "aaa","bbb"。 实现:由开发者1新增 "aaa" ,开发者2新增 bbb。 条件:在一个分支下合作完成。 针对以上情景我们要注意…...
Unity 人物模型学习笔记
一、关于模型的检查 拿到人物模型时,检查人物: 位置信息是否在0点布线/UV是否正常身体各部分是否分开各部分命名是否清晰骨骼需要绑定 二、Unity人物动画 https://www.bilibili.com/video/BV1cc41197mF?spm_id_from333.788.recommend_more_video.-1&a…...
【和春笋一起学C++】(十四)指针与const
将const用于指针,有两种情况: const int *pt; int * const pt; 目录 1. const int *pt 2. int * const pt 3. 扩展 1. const int *pt 首先看第一种情况,const在int的前面,有如下语句: int peoples12࿱…...
AI知识梳理——RAG、Agent、ReAct、LangChain、LangGraph、MCP、Function Calling、JSON-RPC
AI技术I AI技术II RAG 📌 高度凝练表达 RAG (检索增强生成)是一种结合信息检索与生成式人工智能的技术框架,旨在提升大型语言模型(LLM)的输出准确性和实用性。通过在生成响应前引入外部知识库的信息&#…...
ModuleNotFoundError: No module named ‘SDToolbox‘
(py311) C:>python Python 3.11.11 | packaged by Anaconda, Inc. | (main, Dec 11 2024, 16:34:19) [MSC v.1929 64 bit (AMD64)] on win32 Type “help”, “copyright”, “credits” or “license” for more information. from SDToolbox import PostShock_eq Tracebac…...
在宝塔中使用.NET环境管理部署 .NET Core项目
本次采用的演示环境未腾讯云轻量级服务器,使用应用模板,选择宝塔liunx面板。 一、登录宝塔安装环境 直接选择免密登录 进入腾讯云webshell后,输入bt,选择14 选择网站选择.NET项目安装.NET环境管理安装对应的.NET 版本 注意&…...
【DAY21】 常见的降维算法
内容来自浙大疏锦行python打卡训练营 浙大疏锦行 目录 PCA主成分分析 t-sne降维 线性判别分析 (Linear Discriminant Analysis, LDA) 作业: 什么时候用到降维 降维的主要应用场景 知识点回顾: PCA主成分分析t-sne降维LDA线性判别 通常情况下,…...
Linux面试题集合(3)
一秒刷新一次某个进程的状况 top -d 1 -p pid ’显示pid为1、2、3的进程的状况 top -p 1,2,3(按上键选择某个进程) 强制杀死进程 kill -9 pid 说一下ps和top命令的区别 ps命令只能显示执行瞬间的进程状态 top命令实时跟进进程状态 你在工作中什么情况下…...
Pytorch实现常用代码笔记
Pytorch实现常用代码笔记 基础实现代码其他代码示例Network ModulesLossUtils 基础实现代码 参考 深度学习手写代码 其他代码示例 Network Modules Pytorch实现Transformer代码示例 Loss PyTorch实现CrossEntropyLoss示例 Focal Loss 原理详解及 PyTorch 代码实现 PyTorc…...
vscode vue 项目 css 颜色调色版有两个
vue 项目 css 颜色调色版有两个,不知道是哪个插件冲突了。 这个用着很别扭,一个个插件删除后发现是 Vue - Official 这个插件问题,删了就只有一个调色版了。...
MySQL刷题相关简单语法集合
去重 distinct 关键字 eg. :select distinct university from user_profile 返回行数限制: limit关键字 eg. :select device_id from user_profile limit 2 返回列重命名:as 关键字 eg.:select device_id as user_in…...
MySQL多条件查询深度解析
一、业务场景引入 在数据分析场景中,我们经常会遇到需要从多个维度筛选数据的需求。例如,某教育平台运营团队希望同时查看"山东大学"的所有学生以及所有"男性"用户的详细信息,包括设备ID、性别、年龄和GPA数据ÿ…...
RT Thread FinSH(msh)调度逻辑
文章目录 概要FinSH功能FinSH调度逻辑细节小结 概要 RT-Thread(Real-Time Thread)作为一款开源的嵌入式实时操作系统,在嵌入式设备领域得到了广泛应用。 该系统不仅具备强大的任务调度功能,还集成了 FinSH命令行系统,…...
安装nerdctl和buildkitd脚本命令
#!/bin/bash set -euo pipefail # 检查是否以root权限运行 if [ "$(id -u)" -ne 0 ]; then echo "错误:请使用root权限或sudo运行本脚本" >&2 exit 1 fi # 检测openEuler系统(兼容大小写) detect_distrib…...
HTTP与HTTPS协议的核心区别
HTTP与HTTPS协议的核心区别 数据传输安全性 HTTP采用明文传输,数据易被窃听或篡改(如登录密码、支付信息),而HTTPS通过SSL/TLS协议对传输内容加密,确保数据完整性并防止中间人攻击。例如,HTTPS会生成对称加…...
51单片机仿真突然出问题
最近发现仿真出问题了,连最简单的程序运行结果都不对,比如,左移位<<,如果写P1 << 1;则没有问题,但写成P1 << cnt;就不对(cnt已经定义过,而且赋了初值&…...
(C语言)超市管理系统 (正式版)(指针)(数据结构)(清屏操作)(文件读写)(网页版预告)(html)(js)(json)
目录 前言: 源代码: product.h product.c fileio.h fileio.c main.c json_export.h json_export.c tasks.json idex.html script.js 相关步骤: 第一步: 第二步: 第三步: 第四步: 第五步…...
uni-app小程序登录后…
前情 最近新接了一个全新项目,是类似商城的小程序项目,我负责从0开始搭建小程序,我选用的技术栈是uni-app技术栈,其中就有一个用户登录功能,小程序部分页面是需要登录才可以查看的,对于未登录的用户需要引…...