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

uni-app+vue3学习随笔

目录相关

static文件

编译器会把static目录中的内容整体复制到最终编译包内,

非 static 目录下的文件(vue组件、js、css 等)只有被引用时,才会被打包编译。

css、less/scss 等资源不要放在 static 目录下,建议这些公用的资源放在自建的 common 目录下。

注意控制static目录的大小,太大的static目录和太多文件,会造成App安装后第一次启动变慢。

manifest应用配置

配置微信小程序的appid等,以及打包时的一些配置。

components文件

局部组件引入

在根目录下建立components文件夹,在文件夹里创建局部组件,在对应的页面组件内引入即可

注意:components下是组件文件夹,组件文件夹的名称与组件名称一致

路由相关

添加路由

页面创建完成后,需要在pages.json文件内添加文件路径,否则将无法访问相应页面

路由传参

路由传递的参数要从uniapp中的页面生命周期函数-onload内获取,不能在组件生命周期onMounted内获取

<template><view class="">姓名:{{name}} - {{age}}<scroll-view scroll-y="true" ref="scroll"><view></view></scroll-view><navigator url="/pages/demo5/demo5">跳转demo5</navigator><view>----</view><view>计数:{{count}}</view><view>----</view><navigator open-type="reLaunch" url="/pages/demo4/demo4">demo4页面</navigator><view v-for="item in 50">{{item}}</view><view class="fixed" v-if="fixed">↑</view></view>
</template><script setup>
import {onBeforeMount, onMounted, ref, getCurrentInstance} from "vue"
import {onLoad,onReady,onShow,onHide,onUnload,onPageScroll} from "@dcloudio/uni-app"
const name = ref("张三")
const age = ref(18)
const scroll = ref(null)
const count = ref(0)
const fixed = ref(false);let time= setInterval(()=>{count.value++
},50)onLoad((e)=>{	console.log("onload函数");	console.log(e);name.value = e.nameage.value = e.age
})onShow(()=>{console.log("onShow函数");time= setInterval(()=>{count.value++},50)
})onHide(()=>{console.log("onHide函数");clearInterval(time)
})onReady((e)=>{	console.log("onReady函数");
})onBeforeMount(()=>{console.log("onBeforeMount函数");
})onMounted(()=>{console.log("onMounted函数");const instance = getCurrentInstance();// const query = instance.route.query;console.log("onMounted函数-query", instance);})onUnload(()=>{console.log("onUnload卸载页面");
})onPageScroll((e)=>{console.log(e.scrollTop);	fixed.value = e.scrollTop>200})</script><style lang="scss" scoped>
.fixed{width: 100px;height: 100px;background: orange;position: fixed;right:30px;bottom:30px;
}
</style>

CSS相关

rpx

rpx 即响应式 px,一种根据屏幕宽度自适应的动态单位。以 750 宽的屏幕为基准,750rpx 恰好为屏幕宽度。屏幕变宽,rpx 实际显示效果会等比放大,但在 App(vue2 不含 nvue) 端和 H5(vue2) 端屏幕宽度达到 960px 时,默认将按照 375px 的屏幕宽度进行计算,具体配置参考:rpx 计算配置 。

UI在做设计稿时,宽度最好按750px像素做,这样,当UI设计稿的宽度是1px的时候,我们在写CSS样式时就用1rpx就好了,省去换算的问题。

底部安全区域css环境变量

避免底部区域遮挡相关功能

padding-bottom: env(safe-area-inset-bottom);

设置通用样式

不放在Static文件加内,是因为,Static文件内的文件会被打包进去,放在common下的文件,只有引入才会被打包进去,并将样式文件在App.vue文件内引入。

view,swiper,swiper-item{box-sizing: border-box;
}.pageBg{background: linear-gradient(to bottom,transparent,#fff 400rpx),linear-gradient(to right,#beecd8 20%,#F4E2D8);min-height: 80vh;
}.loadingLayout{padding:30rpx 0;
}.safe-area-inset-bottom{height: env(safe-area-inset-bottom);
}

定义颜色变量

uni.scss文件定义uni-app内置的常用样式变量,common下的文件下定义的自定义变量在此文件内引入就可以全局使用。

样式穿透

deep(){.uni-icons{color:$brand-theme-color !important;}
}

插件

unplugin-auto-import自动导入vue和uniapp模块

// 根目录下创建vite.config.js,并拷贝下面的代码
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import AutoImport from 'unplugin-auto-import/vite'export default defineConfig({plugins: [uni(),        // 自动导入配置AutoImport({imports:[// 预设'vue','uni-app'                ]})]    
})

使用官方扩展组件

注意:引入之后不好用的话,就重新编译,小程序必须重新编译。如果下载插件的时候出现合并提示框,点击合并即可。

<uni-icons type="arrow-up" size="26" color="#888"></uni-icons>

 

编译器(#ifdef)

编译器:将uni-app统一代码编译生成每个平台支持的特有代码;如在小程序平台,编译器将.vue文件拆分生成wxmlwxssjs等代码。

条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台

参考文档:什么是编译器 | uni-app官网

在Html中的示例

<!-- ifdef MP 在小程序展示 -->
<!-- #ifdef MP -->
<button open-type="contact">联系客服</button>
<!-- #endif --><!-- ifndef MP 非小程序的情况下展示 -->
<!-- #ifndef MP 非小程序的情况下展示 -->
<button @click="clickContact">拨打电话</button>
<!-- #endif -->

在Script中的示例

	//点击下载const clickDownload = async () => {// #ifdef H5uni.showModal({content: "请长按保存壁纸",showCancel: false})// #endif}

获取系统信息

系统信息的概念 | uni-app官网

uni.getSystemInfoSync()获取系统信息,一般使用同步方法,系统内获取的信息,其单位都是px的。

状态栏高度

const SYSTEM_INFO = uni.getSystemInfoSync();export const getStatusBarHeight = ()=> SYSTEM_INFO.statusBarHeight || 15;

胶囊按钮(小程序才有)

getMenuButtonBoundingClientRect() | uni-app官网

uni.getMenuButtonBoundingClientRect();

标题高度

一般标题高度 = 标题栏距状态栏的距离 + 胶囊按钮的高度 + 胶囊按钮距内容区的高度

const SYSTEM_INFO = uni.getSystemInfoSync();// 状态栏高度
export const getStatusBarHeight = ()=> SYSTEM_INFO.statusBarHeight || 15;// 标题栏高度
export const getTitleBarHeight = ()=>{// 如果存在胶囊按钮if(uni.getMenuButtonBoundingClientRect){// 获取胶囊按钮高度以及距顶部的距离let {top, height} = uni.getMenuButtonBoundingClientRect();// 胶囊按钮高度 + 上下边距return height + (top - getStatusBarHeight()) * 2		}else{return 40;}
}

自定义标题栏时占位区高度

const SYSTEM_INFO = uni.getSystemInfoSync();// 状态栏高度
export const getStatusBarHeight = ()=> SYSTEM_INFO.statusBarHeight || 15;// 标题栏高度
export const getTitleBarHeight = ()=>{// 如果存在胶囊按钮if(uni.getMenuButtonBoundingClientRect){// 获取胶囊按钮高度以及距顶部的距离let {top, height} = uni.getMenuButtonBoundingClientRect();// 胶囊按钮高度 + 上下边距return height + (top - getStatusBarHeight()) * 2		}else{return 40;}
}// 自定义标题栏占位元素的高度 = 状态栏高度 + 标题栏高度
export const  getNavBarHeight = ()=> getStatusBarHeight() + getTitleBarHeight();

头条小程序的头部icon

相关API查看抖音小程序开发文档,uni-app中没有写。

const SYSTEM_INFO = uni.getSystemInfoSync();// 状态栏高度
export const getStatusBarHeight = ()=> SYSTEM_INFO.statusBarHeight || 15;// 标题栏高度
export const getTitleBarHeight = ()=>{// 如果存在胶囊按钮if(uni.getMenuButtonBoundingClientRect){// 获取胶囊按钮高度以及距顶部的距离let {top, height} = uni.getMenuButtonBoundingClientRect();// 胶囊按钮高度 + 上下边距return height + (top - getStatusBarHeight()) * 2		}else{return 40;}
}// 自定义标题栏占位元素的高度 = 状态栏高度 + 标题栏高度
export const  getNavBarHeight = ()=> getStatusBarHeight() + getTitleBarHeight();// 抖音小程序标题有一个icon
export const getLeftIconLeft = ()=> {// #ifdef MP-TOUTIAO// 下面这种语法是深度解构let {leftIcon: {left, width}}  = tt.getCustomButtonBoundingClientRect();return left + parseInt(width);// #endif// #ifndef MP-TOUTIAOreturn 0// #endif	
}

网络请求

uni.request

在各个小程序平台运行时,网络相关的 API 在使用前需要配置域名白名单。详细内容请参考官方文档 uni.request(OBJECT) | uni-app官网

function getData() {uni.request({url: '/XXX/XXX',method: 'POST', // 默认是getdata: {name: '测试'},success: (res: any) => {// 将接口的返回结果都包在data中console.log(res.data)}})
}

使用Promise封装request


const BASE_URL = 'https://XXX.XXX.com/XXX/XXX';export function request(config = {}){	let {url,data = {},method = "GET",header = {}} = config;url = BASE_URL + url;header['access-key'] = "XXX";	header['token'] = 'XXX';return new Promise((resolve, reject)=>{		uni.request({url,data,method,header,success: res=>{if(res.data.errCode === 0){// 直接取接口的返回值,去除中间包的那一层dataresolve(res.data)}else if(res.data.errCode === 400){uni.showModal({title: "错误提示",content: res.data.errMsg,showCancel: false})reject(res.data)}else{uni.showToast({title: res.data.errMsg,icon: "none"})reject(res.data)}				},fail: err=>{reject(err)}})})
}

打包

web/H5

1、路径模式,如果有后端做Nginx转发,就可以选择history,没有就选hash模式

2、将打包后的东西放在根路径下,就用 ./ 就可以了,但是一般情况下,服务器中可能有多个文件,比如说后端文件、前端文件、管理系统的文件,一个服务器里可能存在多个包,所以大多数情况下,运行的基础路径都会指定一个基础路径。

3、打包流程

 

打包APP-安卓

一、相关配置

二、运行APP

遇到下面这个弹窗,有两种解决方式:

1、把安卓手机直接连在电脑上

2、下载模拟器,百度自行下载即可

三、打包

 四、版本更新

uniPush统一推送与App升级中心uni-upgrade-center系列uniapp进阶课,安卓apk打包及自定义基座_哔哩哔哩_bilibili

即时设计

1、打开即时设计,选在创建文件

2、把UI做好的图拖入文件中 ,在图上右键锁定,这样图片就不会随便移动

ctrl+鼠标滚轮可以放大缩小图片

3、通过切片功能来模拟量图工具

相关文章:

uni-app+vue3学习随笔

目录相关 static文件 编译器会把static目录中的内容整体复制到最终编译包内&#xff0c; 非 static 目录下的文件&#xff08;vue组件、js、css 等&#xff09;只有被引用时&#xff0c;才会被打包编译。 css、less/scss 等资源不要放在 static 目录下&#xff0c;建议这些…...

JetBrains(全家桶: IDEA、WebStorm、GoLand、PyCharm) 2024.3+ 2025 版免费体验方案

JetBrains&#xff08;全家桶: IDEA、WebStorm、GoLand、PyCharm&#xff09; 2024.3 2025 版免费体验方案 前言 JetBrains IDE 是许多开发者的主力工具&#xff0c;但从 2024.02 版本起&#xff0c;JetBrains 调整了试用政策&#xff0c;新用户不再享有默认的 30 天免费试用…...

移远通信联合德壹发布全球首款搭载端侧大模型的AI具身理疗机器人

在汹涌澎湃的人工智能浪潮中&#xff0c;具身智能正从实验室构想迈向现实应用。移远通信凭借突破性的端侧AI整体解决方案&#xff0c;为AI机器人强势赋能&#xff0c;助力其实现跨行业拓展&#xff0c;从工业制造到服务接待&#xff0c;再到医疗康养&#xff0c;不断改写各行业…...

嵌入式硬件篇---手柄控制控制麦克纳姆轮子

文章目录 前言1. 变量定义2. 摇杆死区设置3. 模式检查4. 摇杆数据处理4.1 右摇杆垂直值&#xff08;psx_buf[7]&#xff09;4.2 右摇杆水平值&#xff08;psx_buf[8]&#xff09;4.3 左摇杆水平值&#xff08;psx_buf[5]&#xff09;4.4 左摇杆垂直值&#xff08;psx_buf[6]&am…...

XML Schema 实例

XML Schema 实例 引言 XML(可扩展标记语言)是一种用于标记电子文件使其具有结构性的标记语言。XML Schema 是一种用于定义 XML 文档结构的机制,它定义了 XML 文档中允许的数据类型、元素和属性。本文将详细探讨 XML Schema 实例,包括其基本概念、结构、用途以及实例分析。…...

Datax-web部署文档(超详细)

Datax-web部署文档&#xff08;超详细&#xff09; Datax部署 # 参考官方文档 https://github.com/alibaba/DataX/blob/master/userGuid.md# 下载datax已经封装好的文件&#xff0c;不推荐源码自己编译 https://datax-opensource.oss-cn-hangzhou.aliyuncs.com/202309/datax.…...

基于javaweb的SSM敬老院养老院管理系统(源码+文档+部署讲解)

技术范围&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容&#xff1a;免费功能设计、开题报告、任务书、中期检查PPT、系统功能实现、代码编写、论文编写和辅导、论…...

专题地图的立体表达-基于QGIS和PPT的“千层饼”视图制作实践

目录 前言 一、QGIS准备基础数据 1、QGIS 相关插件 2、图层标绘操作 二、PPT中制作 1、调整图片的规格 2、设置旋转 3、添加文字 三、总结 前言 在信息爆炸的时代&#xff0c;数据的可视化呈现变得愈发关键&#xff0c;而专题地图作为传递地理空间信息的有力工具&#…...

DeepSeek-R1 论文阅读总结

1. QA问答&#xff08;我的笔记&#xff09; Q1: DeepSeek如何处理可读性问题&#xff1f; 通过构建冷启动数据&#xff08;数千条长CoT数据&#xff09;微调基础模型&#xff0c;结合多阶段训练流程&#xff08;RL训练、拒绝采样生成SFT数据&#xff09;&#xff0c;并优化输…...

如何选择适合您智能家居解决方案的通信协议?

如何选择适合您智能家居解决方案的通信协议&#xff1f; 在开发智能家居产品时&#xff0c;选择合适的通信协议对于设备的高效运行及其在智能家居系统中的互操作性至关重要。市面上协议众多&#xff0c;了解它们的特性并在做决定前考虑各种因素是非常必要的。以下是一些帮助您…...

蓝桥杯备考:set容器用法(lower_bound)---营业额统计

如图所示&#xff0c;这道题的暴力解法就是枚举每天的营业额&#xff0c;让该营业额和前面的天的营业额依次相减取最小值这样的话我们的时间复杂度就是N平方&#xff0c;我们是很有可能超时的 所以我们选择用set容器的二分查找功能 我们每次遍历到一个数的时候&#xff0c;前…...

vue3 动态添加路由并生成左侧菜单栏

先说下思路&#xff0c;登录后跳转到基础页面&#xff0c; 每访问一个页面时&#xff0c;会进到路由守卫的方法 守卫进行身份验证&#xff0c;登录成功后才能跳转到静态路由外的页面&#xff0c;否则就重定向回login页面 登录后跳转到基础页面&#xff08;因为基础页面包含了左…...

上下文微调(Contextual Fine-Tuning, CFT)提高大型语言模型(LLMs)在特定领域的学习和推理能力

大型语言模型(LLMs)在开放领域任务中表现出色,但在快速演变的专业领域(如医学、金融)中面临挑战: 知识更新难题:传统指令微调(Instruction Fine-Tuning, IFT)依赖显式指令,难以适应动态知识。灾难性遗忘:持续预训练(Continued Pretraining, CPT)可能导致模型遗忘已…...

L2-4 吉利矩阵

输入样例&#xff1a; 7 3输出样例&#xff1a; 666 这道题是暴力纯搜&#xff0c;但是很难想&#xff0c;我这个是看的别人的代码 #include "bits/stdc.h" using namespace std; int x[20][20]; int l, n; int cnt 0; int sumx[5], sumy[5]; void dfs(int x, in…...

⭐算法OJ⭐汉明距离【位操作】(C++ 实现)Hamming Distance

Hamming Distance&#xff08;汉明距离&#xff09;是用于衡量两个等长字符串在相同位置上不同字符的个数的度量。它通常用于比较两个二进制字符串或编码序列的差异。 定义 给定两个长度相同的字符串 A A A 和 B B B&#xff0c;它们的汉明距离 D ( A , B ) D(A,B) D(A,B)…...

数据可信、隐私可控:CESS 如何打造波卡生态数据新基建?

原文&#xff1a;https://messari.io/report/cess-network-a-deep-dive-into-programmable-data-value-infrastructure作者&#xff1a;Messari编译&#xff1a;OneBlock波卡生态一直以来以其跨链互操作性和灵活性吸引了众多创新项目&#xff0c;尤其是在 DePIN&#xff08;去中…...

HCIA-11.以太网链路聚合与交换机堆叠、集群

链路聚合背景 拓扑组网时为了高可用&#xff0c;需要网络的冗余备份。但增加冗余容易后会出现环路&#xff0c;所以我们部署了STP协议来破除环路。 但是&#xff0c;根据实际业务的需要&#xff0c;为网络不停的增加冗余是现实需要的一部分。 那么&#xff0c;为了让网络冗余…...

网络安全之数据加密(DES、AES、RSA、MD5)

刚到公司时&#xff0c;我的工作就是为app端提供相应的接口。之前app使用的是PHP接口&#xff0c;对数据加密方面做得比较少。到使用java接口时&#xff0c;老大开始让我们使用DES加密&#xff0c;进行数据传输&#xff0c;但是后来觉得DES是对称加密&#xff0c;密钥存在客户端…...

Vim忍者速成秘卷:让你的键盘冒出残影の奥义

🎯 核心原理 通过 超低延迟配置 + 肌肉记忆优化 + 视觉欺骗技术,达成行云流水的操作体验。就像《火影忍者》结印般流畅! ⚡ 残影生成术(基础篇) " 🛩️ 贴地飞行模式(.vimrc 极速配置) set timeoutlen=300 " 快捷键响应时间压缩至300ms(武士刀级响应)…...

致远互联FE协作办公平台 存在SQL注入漏洞(DVB-2025-8942)

免责声明 本文所描述的漏洞及其复现步骤仅供网络安全研究与教育目的使用。任何人不得将本文提供的信息用于非法目的或未经授权的系统测试。作者不对任何由于使用本文信息而导致的直接或间接损害承担责任。如涉及侵权,请及时与我们联系,我们将尽快处理并删除相关内容。 0x01…...

通俗易懂动态表单自定义字段解决方案

动态表单自定义字段解决方案 1. 背景&#xff1a; 有些项目可能会有要求&#xff0c;客户可以自定义设计字段&#xff0c;并且字段还需要在后台设置可展示、可搜索。 2. 场景&#xff1a; 比如说报名场景&#xff0c;我们并不知道客户想让用户填哪些东西。下面我就举个例子&…...

CentOS7离线部署安装Dify

离线部署安装Dify 在安装 Dify 之前&#xff0c;请确保您的机器满足以下最低系统要求&#xff1a; CPU > 2 核 内存 > 4 GiB 1.安装docker和docker compose 启动 Dify 服务器最简单的方式是通过docker compose。因此现在服务器上安装好docker和docker compose&#xf…...

Dify后端结构与二次开发指南(一)

Dify 的后端基于 Python 编写&#xff0c;使用 Flask 作为 Web 框架&#xff0c;SQLAlchemy 作为 ORM&#xff08;对象关系映射&#xff09;&#xff0c;Celery 作为任务队列&#xff0c;Flask-Login 处理用户认证和授权。以下是对 Dify 后端结构的详细介绍&#xff0c;以及如何…...

vscode arm拓展 keil acm5 到acm6迁移

目录 1. Arm Keil Studio Visual Studio 代码扩展用户指南&#xff08;only support acm6 project&#xff09;&#xff08;能不迁移还是别迁移了&#xff0c;工程量太大啦&#xff0c;会出很多问题的&#xff09; 1. Arm Keil Studio Visual Studio 代码扩展用户指南&#xff…...

软件工程概述、软件过程模型、逆向工程(高软45)

系列文章目录 软件工程概述、软件过程模型、逆向工程。 文章目录 系列文章目录前言一、软件工程概述二、能力成熟度模型1.能力成熟度模型CMM2.能力成熟度模型集成CMMI 三、软件过程模型1.瀑布模型SDLC2.原型化模型3.螺旋模型4.增量模型5.喷泉模型6.敏捷模型7.统一过程模型RUP 四…...

医药制造行业现状 医药制造行业内检实验室LIMS

在医药制造行业中&#xff0c;质量控制是确保产品安全性和有效性的关键环节。随着科技的进步和监管要求的日益严格&#xff0c;传统的实验室信息管理系统&#xff08;LIMS&#xff09;已经难以满足现代医药制造企业对高效、精准管理的需求。面对这一挑战&#xff0c;白码内检实…...

FX-std::list

std::list 是 C 标准库中的一个双向链表容器&#xff0c;定义在 <list> 头文件中。它支持在任意位置高效地插入和删除元素&#xff0c;但不支持随机访问。以下是 std::list 的基本用法和一些常见操作&#xff1a; 1. 包含头文件 #include <list> 2. 定义和初始化…...

配置安全网站

配置网站 确定是Debian系统 更新索引&#xff1a;apt update 安装包&#xff1a;apt upgrade -y 查看nginx状态&#xff1a;systemctl status nginx 安装&#xff1a;nginx&#xff1a;apt install nginx 启动&#xff1a;systemctl start nginx 在/var/www/里面创建一个…...

C/C++中对字符处理的常用函数

C语言中的 ctype.h 头文件提供了一系列字符分类和转换函数&#xff0c;用于高效处理字符相关操作。这些函数通过接受 int 类型参数&#xff08;需为 unsigned char 或 EOF &#xff08;-1&#xff09;值&#xff09;&#xff0c;返回非零值表示条件正确&#xff0c;返回0表示错…...

深度学习分词器char-level实战详解

一、三种分词器基本介绍 word-level&#xff1a;将文本按照空格或者标点分割成单词&#xff0c;但是词典大小太大 subword-level&#xff1a;词根分词&#xff08;主流&#xff09; char-level&#xff1a;将文本按照字母级别分割成token 二、charlevel代码 导包&#xff1…...

根据开始和结束日期,获取每一天和每个月的开始和结束日期的list

获取开始日期与结束日期之间每天的list /*** 根据传入的开始时间和结束时间,筛选出所有的天的list;** param startTime* param endTime*/public Map<String, List<String>> fetchDayListBetweenStartAndEnd(String startTime, String endTime) {// 创建mapMap<…...

实时采集到的语音进行语音识别

要在.NET Framework 4.8中使用C#实现离线实时语音识别&#xff0c;可以使用开源库Vosk&#xff08;支持离线ASR&#xff09;配合音频处理库NAudio。 步骤 1&#xff1a;安装依赖库 1.1. 安装NuGet包&#xff1a; - Install-Package NAudio&#xff08;处理音频输入&#xff09…...

《苍穹外卖》SpringBoot后端开发项目核心知识点与常见问题整理(DAY1 to DAY3)

目录 一、在本地部署并启动Nginx服务1. 解压Nginx压缩包2. 启动Nginx服务3. 验证Nginx是否启动成功&#xff1a; 二、导入接口文档1. 黑马程序员提供的YApi平台2. YApi Pro平台3. 推荐工具&#xff1a;Apifox 三、Swagger1. 常用注解1.1 Api与ApiModel1.2 ApiModelProperty与Ap…...

【从零开始学习计算机科学】数据库系统(十一)云数据库、NoSQL 与 NewSQL

【从零开始学习计算机科学】数据库系统(十一)云数据库、NoSQL 与 NewSQL 云数据库云服务器的服务云数据库和传统的分布式数据库的异同NoSQLNoSQL数据库的特点CAP定理NoSQL的特性NoSQL数据库的分类NoSQL的适用场景Nosql数据库实例-RedisRedis的优势MongoDBMongoDB的特点NewSQL…...

Linux入门 全面整理终端 Bash、Vim 基础命令速记

Linux入门 2025 超详细全面整理 Bash、Vim 基础命令速记 刚面对高级感满满的 终端窗口是不是有点懵&#xff1f;于是乎&#xff0c;这份手册就是为你准备的高效学习指南&#xff01;我把那些让人头大的系统设置、记不住的命令都整理成了对你更友好的格式&#xff0c;让你快速学…...

LInux基础--apache部署网站

httpd的安装 yum -y install httpdhttpd的使用 启动httpd systemctl enable --now httpd使用enable --now 进行系统设置时&#xff0c;会将该服务设置为开机自启并且同时开启服务 访问httpd 创建虚拟主机 基于域名 在一台主机上配置两个服务server1和server2&#xff0c;其…...

重生之我在学Vue--第12天 Vue 3 性能优化实战指南

重生之我在学Vue–第12天 Vue 3 TypeScript 类型系统深度整合 文章目录 重生之我在学Vue--第12天 Vue 3 TypeScript 类型系统深度整合前言一、TypeScript与Vue3的集成1.1 项目初始化配置1.2 类型配置文件解析 二、类型声明实战2.1 Props类型约束2.2 Emit事件类型2.3 组合式AP…...

Go 语言封装 HTTP 请求的 Curl 工具包

文章目录 Go 语言封装 HTTP 请求的 Curl 工具包&#x1f3d7;️ 工具包结构简介核心结构体定义初始化函数 &#x1f31f; 功能实现1. 设置请求头2. 构建请求3. 发送请求4. 发送 GET 请求5. 发送 POST 请求6. 发送 PUT 请求7. 发送 DELETE 请求8. 读取响应体 &#x1f4a1; 实现…...

【Go】Go MongoDB 快速入门

1. MongoDB 简介 1.1 MongoDB 介绍 由于我们时常需要存储一些大文本数据&#xff08;比如文章内容&#xff09;&#xff0c;存储到一些关系型数据库可能不是最好的选择&#xff0c;这个时候就需要引入一些 NoSQL&#xff08;Not Only SQL&#xff09;&#xff0c;比如 MongoD…...

Java --- 根据身份证号计算年龄

介绍 根据身份证号计算年龄 Java代码 /*** 根据身份证号计算年龄* param birthDateStr* return*/public static int calculateAge(String birthDateStr) {try {birthDateStrbirthDateStr.substring(6,68);// 定义日期格式SimpleDateFormat sdf new SimpleDateFormat("…...

[LeetCode热门100题]|137,260,268,面试17.19

1、137 只出现一次数字|| 1、题目描述 137 只出现一次数字||https://leetcode.cn/problems/single-number-ii/description/ 给你一个整数数组 nums &#xff0c;除某个元素仅出现 一次 外&#xff0c;其余每个元素都恰出现 三次 。请你找出并返回那个只出现了一次的元素。 你…...

WPF未来展望:紧跟技术发展趋势,探索新的可能性

WPF未来展望&#xff1a;紧跟技术发展趋势&#xff0c;探索新的可能性 一、前言二、WPF 与.NET 技术的融合发展2.1 拥抱.NET Core2.2 利用.NET 5 及后续版本的新特性 三、WPF 在新兴技术领域的应用拓展3.1 与云计算的结合3.2 融入物联网生态 四、WPF 在用户体验和设计方面的创新…...

maxwell

一、maxwell简介 它是一款轻量级工具&#xff0c;主要用于实现 MySQL 到 Kafka 的数据实时同步&#xff0c;尤其适合对实时性要求较高的场景。 1.核心功能 借助解析 MySQL 的 Binlog&#xff0c;能够实时捕获数据变更&#xff0c;并将这些变更数据发送至 Kafka。 2.缺点 仅…...

Qt 6.6.1 中 QPixmap::grabWindow() 的用法与替代方案

一、Qt 6 中的 API 变化 ‌弃用 QPixmap::grabWindow()‌ 在 Qt 6 中&#xff0c;QPixmap::grabWindow() 已被迁移至 QScreen 类&#xff0c;需通过 QScreen::grabWindow() 实现窗口截取‌。 原因&#xff1a; Qt 6 重构了图形模块&#xff0c;QPixmap 的截屏功能被整合到 QSc…...

【软件】免费的PDF全文翻译软件,能保留公式图表的样式

转载请注明出处&#xff1a;小锋学长生活大爆炸[xfxuezhagn.cn] 如果本文帮助到了你&#xff0c;欢迎[点赞、收藏、关注]哦~ 很多PDF全文翻译软件都是收费的&#xff0c;而划线翻译看着又很累。这个开源的PDF全文翻译软件非常好用&#xff0c;并且能够保留公式、图表、目录和注…...

LeetCode 112. 路径总和 II java题解

https://leetcode.cn/problems/path-sum/description/ class Solution {boolean resfalse;//记录结果public boolean hasPathSum(TreeNode root, int targetSum) {if(rootnull) return res;int sum0;find(root,sum,targetSum);return res;}public void find(TreeNode root,int…...

如何快速定位导致服务器卡顿的进程

在 Linux 系统中&#xff0c;可以通过多种方式快速定位导致服务器卡顿的进程。以下是一些常用的方法&#xff1a; 1. 使用 top 和 htop 命令&#xff1a; 使用 top 或 htop 命令可以实时监视系统资源利用情况&#xff0c;包括 CPU 和内存占用情况&#xff0c;以及运行的进程列…...

【计算机网络】第八版和第七版的主要区别,附PDF

「《计算机网络》(... 谢希仁」&#xff0c;https://pan.quark.cn/s/7c2147cb48f7 1. 新增内容 - 软件定义网络&#xff08;SDN&#xff09;&#xff1a;第八版在网络层章节中新增了对SDN的简介&#xff08;第4章&#xff09;&#xff0c;介绍了其基本原理和应用。 - Wi-Fi代…...

ubuntu20.04_vscode_snap安装方式

停止 Snap 服务 运行以下命令&#xff1a; sudo systemctl stop snapd 彻底停止 Snap 服务 停止 snapd.service 和 snapd.socket&#xff1a; sudo systemctl stop snapd.socket sudo systemctl stop snapd.service 禁用 Snap 服务的自动启动&#xff08;可选&#xff09;&…...

基于SpringBoot实现旅游酒店平台功能十一

一、前言介绍&#xff1a; 1.1 项目摘要 随着社会的快速发展和人民生活水平的不断提高&#xff0c;旅游已经成为人们休闲娱乐的重要方式之一。人们越来越注重生活的品质和精神文化的追求&#xff0c;旅游需求呈现出爆发式增长。这种增长不仅体现在旅游人数的增加上&#xff0…...