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

uniapp常用组件

写在前面

今天将uniapp中的组件都过了一遍,上手难度不大,但是还是遇到了一些问题:

  1. HBuilder实在是太难用,不管是插件生态还是设计之类的,总之就是用的哪哪不顺手
  2. 虽然打开内置浏览器是挺方便的,但是不知道是不是其热重载什么的,当你配置路由或者跨页修改时它会出现乱码之类的情况,建议关掉重开
  3. 不支持自定义属性……
  4. git插件不是很好用……
  5. 虽然设置了失去焦点自动保存但是就是很鸡肋感受很不好,建议ctrl+s焊手上
  6. 报错功能不完善,像是个别单词拼写错误什么的不报错很难受
  7. 我发现各类ai对小程序开发貌似都不太感冒,有点冒傻

关于我写的练习demo

涵盖所有常用组件与常用方法,已上传至github链接请点
在这里插入图片描述

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

在这里插入图片描述

还有还有

  • 如有纰漏请谅解,以官方文档为准
  • 后面这段时间我会学习小程序开发的知识,会持续更新
  • 可以查看我的github,后续我会上传我的uniapp相关练习代码
  • 有兴趣的话可以浏览我的个人网站,我会在上面持续更新内容,我新配置了评论功能,可以留下一个友善的评论,这对我有很大帮助

text

文本组件。用于包裹文本内容。

在app-uvue和app-nvue中,文本只能写在text中,而不能写在view的text区域。

虽然app-uvue中写在view的text区域的文字,也会被编译器自动包裹一层text组件,看起来也可以使用。但这样会造成无法修改该text文字的样式

属性说明

属性名类型默认值说明平台差异说明
selectableBooleanfalse文本是否可选
user-selectBooleanfalse文本是否可选微信小程序
spaceString显示连续空格钉钉小程序不支持
decodeBooleanfalse是否解码百度、钉钉小程序不支持

space 值说明

说明
ensp中文字符空格一半大小
emsp中文字符空格大小
nbsp根据字体设置的空格大小

子组件

text组件在web浏览器渲染(含浏览器、小程序webview渲染模式、app-vue)和uvue中,可以并只能嵌套text组件。

在nvue中,text组件不能嵌套。

Tips

  • 支持 \n 方式换行。
  • 在app-nvue下,只有<text>才能包裹文本内容。无法在<view>组件包裹文本。
  • decode 可以解析的有 < > & '
  • 各个操作系统的空格标准并不一致。
  • 除了文本节点以外的其他节点都无法长按选中。
  • 如果使用 <span> 组件编译时会被转换为 <text>
  • nvue 样式 word-wrap 在 Android 平台暂不支持

scroll-view

可滚动视图区域。用于区域滚动。

需注意在webview渲染的页面中,区域滚动的性能不及页面滚动。

主要特性

  • 竖向滚动:通过设置 scroll-y="true" 来启用垂直方向上的滚动。
  • 横向滚动:通过设置 scroll-x="true" 来启用水平方向上的滚动。
  • 固定高度/宽度:对于竖向滚动,需要给 <scroll-view> 设置一个固定的高度;对于横向滚动,则通常需要设置一个固定的宽度。
  • 样式控制:可以通过 CSS 控制滚动视图的样式,比如隐藏滚动条等。

注意事项

  • 在使用竖向滚动时,必须为 <scroll-view> 设置一个明确的高度。
  • 对于横向滚动,需要确保子元素不会换行(即 white-space: nowrap),并且每个子元素都设置了 display: inline-block
  • 当内容较少不足以触发滚动时,滚动条不会出现。
  • 不要在 <scroll-view> 中放置原生组件如 mapvideo,特别是在小程序端。
  • 避免将过长的数据列表放入 <scroll-view> 中,这可能会导致性能问题。对于长列表,请考虑使用分页加载或虚拟列表技术。

一键回到顶部

总结你提供的方法,可以将实现点击按钮返回顶部功能的关键步骤和代码解释如下:

数据绑定
  • 在 Vue 组件的 data() 函数中定义了一个名为 scrollTop 的变量。这个变量与 <scroll-view> 组件的 :scroll-top 属性绑定,意味着当 scrollTop 变量值变化时,滚动视图会自动更新其垂直滚动位置。
事件监听
  • 使用 @scroll 事件监听器来捕获滚动事件,并在事件处理函数中更新组件实例中的一个属性(例如 old.scrollTop),用于保存当前滚动位置。这使得可以在需要的时候访问或修改滚动位置。
返回顶部方法
  • goTop 方法是实现返回顶部的核心逻辑:
    • 首先,它设置 scrollTop 为当前滚动位置。
    • 然后使用 $nextTick 方法确保 DOM 更新完成后,再次将 scrollTop 设置为 0,以触发滚动到顶部的动作。
    • 此外,还使用了 uni.showToast 来显示一条消息提示用户滚动位置已经被重置为顶部。
goTop: function(e) {// 解决视图层不同步的问题this.scrollTop = this.old.scrollTop;this.$nextTick(function() {this.scrollTop = 0;});uni.showToast({icon: "none",title: "纵向滚动 scrollTop 值已被修改为 0"})
}
  • 在模板中,有一个带有 @tap="goTop" 属性的 <view> 标签,这意味着当用户点击该区域时,将会调用 goTop 方法来执行返回顶部的操作。

swiper

滑块视图容器。

一般用于左右滑动或上下滑动,比如banner轮播图。

注意滑动切换和滚动的区别,滑动切换是一屏一屏的切换。swiper下的每个swiper-item是一个滑动切换区域,不能停留在2个滑动区域之间。

属性说明

  • indicator-dots: 是否显示面板指示点,默认为 false
  • autoplay: 是否自动切换,默认为 false
  • interval: 自动切换时间间隔,默认为 5000ms
  • duration: 滑动动画时长,默认为 500ms
  • circular: 是否采用衔接滑动,默认为 false。如果设置为 true,则可以实现无缝滚动效果。
  • vertical: 是否纵向模式,默认为 false。如果设置为 true,则变为上下滑动。
  • current: 当前所在滑块的索引值,默认为 0

事件监听

  • @change: 轮播图切换时触发,可以通过此事件获取当前索引。

    示例:

    <swiper @change="swiperChange"><!-- ... -->
    </swiper>
    
    methods: {swiperChange(e) {console.log('当前索引:', e.detail.current);}
    }
    

注意事项

  1. 性能优化:当轮播图中的图片较多或者较大时,建议进行图片懒加载处理,以提高页面加载速度。
  2. 样式调整:根据实际需求调整 <swiper><swiper-item> 的样式,比如高度、宽度等。
  3. 兼容性:确保在不同平台(如微信小程序、H5等)上测试轮播图的表现,因为各平台可能存在细微差异。

通过上述配置和属性设置,你可以轻松创建一个功能齐全且美观的轮播图组件。此外,结合其他自定义样式或交互逻辑,可以让轮播图更加符合你的项目需求。

movable-view

可移动的视图容器,在页面中可以拖拽滑动或双指缩放。

movable-view必须在movable-area组件中,并且必须是直接子节点,否则不能移动。

以下是 movable-view 组件的属性说明,根据你提供的信息整理而成:

属性名类型默认值说明平台差异说明
directionStringnone定义 movable-view 的移动方向。可选值有 all(任意方向)、vertical(垂直方向)、horizontal(水平方向)、none(不可移动)-
inertiaBooleanfalse是否带有惯性,即在拖动结束后是否还会继续滑动一小段距离。-
out-of-boundsBooleanfalse当超过可移动区域后,movable-view 是否还可以继续移动。-
xNumber / String-定义 x 轴方向的偏移量。如果设置的值不在可移动范围内,则会自动调整到可移动范围,并且改变此值会触发动画效果。-
yNumber / String-定义 y 轴方向的偏移量。如果设置的值不在可移动范围内,则会自动调整到可移动范围,并且改变此值会触发动画效果。-
dampingNumber20阻尼系数,用于控制 x 或 y 方向改变时动画的速度和过界回弹的效果。数值越大,移动速度越快。360小程序不支持
frictionNumber2摩擦系数,影响惯性滑动的停止速度。数值越大,摩擦力越大,滑动越快停止。必须大于 0,否则会被设置成默认值。360小程序不支持
disabledBooleanfalse是否禁用 movable-view。当为 true 时,组件将无法被用户操作。-
scaleBooleanfalse是否支持双指缩放。默认情况下,缩放手势生效区域是在 movable-view 内部。360小程序不支持
scale-minNumber0.1/0.5定义缩放倍数的最小值。对于 0.1 倍的缩放,需要 App(4.51+)、H5(4.51+)、微信小程序(4.51+) 版本的支持。-
scale-maxNumber10定义缩放倍数的最大值。-
scale-valueNumber1定义当前的缩放倍数,取值范围通常为 0.1/0.5 至 10。对于 0.1 倍的缩放,同样需要特定版本的支持。-
animationBooleantrue是否使用动画效果。当改变 xy 的值时,是否以动画形式过渡。-
@changeEventHandle-拖动过程中触发的事件,event.detail 包含 {x: x, y: y, source: source},其中 source 可能的值包括 touch(拖动)、touch-out-of-bounds(超出移动范围)、out-of-bounds(超出移动范围后的回弹)、friction(惯性)以及空字符串(setData)。-
@scaleEventHandle-缩放过程中触发的事件,event.detail 包含 {x: x, y: y, scale: scale}。主要用于监听缩放动作的发生。-

icon

属性说明

属性名类型默认值说明
typeStringicon的类型
sizeNumber23icon的大小,单位px
colorColoricon的颜色,同css的color

各平台 type 有效值说明:

平台type 有效值
App、H5、微信小程序、QQ小程序success, success_no_circle, info, warn, waiting, cancel, download, search, clear
支付宝小程序info, warn, waiting, cancel, download, search, clear, success, success_no_circle,loading
百度小程序success, info, warn, waiting, success_no_circle, clear, search, personal, setting, top, close, cancel, download, checkboxSelected, radioSelected, radioUnselect

rich-text

富文本。

支持默认事件,包括:click、touchstart、touchmove、touchcancel、touchend、longpress.

属性名类型默认值说明平台兼容
nodesArray / String[]节点列表 / HTML String
spacestring显示连续空格App、H5、微信基础库2.4.1+详见、QQ小程序、抖音小程序、快手小程序详见
selectableBooleantrue富文本是否可以长按选中,可用于复制,粘贴等场景百度小程序(仅真机支持,基础库 3.150.1 以下版本默认为 false)
image-menu-preventBooleanfalse阻止长按图片时弹起默认菜单(将该属性设置为image-menu-prevent或image-menu-prevent=“true”),只在初始化时有效,不能动态变更;若不想阻止弹起默认菜单,则不需要设置此属性百度小程序
previewBoolean富文本中的图片是否可点击预览。在不设置的情况下,若 rich-text 未监听点击事件,则默认开启。未显示设置 preview 时会进行点击默认预览判断,建议显示设置 preview百度小程序
@itemclickEventHandle拦截点击事件(只支持 aimg标签),返回当前node信息 event.detail={node}H5 (3.2.13+)、App-Vue (3.2.13+)

progress

属性名类型默认值说明平台差异说明
percentNumber百分比0~100
show-infoBooleanfalse在进度条右侧显示百分比
border-radiusNumber/String0圆角大小app-nvue、微信基础库2.3.1+、QQ小程序、快手小程序、京东小程序
font-sizeNumber/String16右侧百分比字体大小app-nvue、微信基础库2.3.1+、QQ小程序、京东小程序
stroke-widthNumber6进度条线的宽度,单位px
activeColorColor#09BB07(百度为#E6E6E6)已选择的进度条的颜色
backgroundColorColor#EBEBEB未选择的进度条的颜色
activeBooleanfalse进度条从左往右的动画
active-modeStringbackwards动画从头播;forwards:动画从上次结束点接着播App、H5、微信小程序、QQ小程序、快手小程序、京东小程序
durationNumber30进度增加1%所需毫秒数App-nvue2.6.1+、微信基础库2.8.2+、H5 3.1.11+、App-Vue 3.1.11+、快手小程序、京东小程序
@activeendEventHandle动画完成事件微信小程序、京东小程序

checkbox-group

属性说明

属性名类型默认值说明
@changeEventHandle<checkbox-group>中选中项发生改变是触发 change 事件,detail = {value:[选中的checkbox的value的数组]}

checkbox

多选项。在1组check-group中可选择多个

属性说明

属性名类型默认值说明平台差异说明
valueString<checkbox> 标识,选中时触发 <checkbox-group> 的 change 事件,并携带 <checkbox> 的 value。
disabledBooleanfalse是否禁用
checkedBooleanfalse当前是否选中,可用来设置默认选中
colorColorcheckbox的颜色,同css的color
backgroundColorColor#ffffffcheckbox默认的背景颜色H5(3.99+)、App-Vue(3.99+)
borderColorColor#d1d1d1checkbox默认的边框颜色H5(3.99+)、App-Vue(3.99+)
activeBackgroundColorColor#ffffffcheckbox选中时的背景颜色,优先级大于color属性H5(3.99+)、App-Vue(3.99+)
activeBorderColorColor#d1d1d1checkbox选中时的边框颜色H5(3.99+)、App-Vue(3.99+)
iconColorColor#007affcheckbox的图标颜色H5(3.99+)、App-Vue(3.99+)

Button

在UniApp中,<button> 组件是一个非常基础且重要的组件,用于创建按钮。它不仅支持文本内容,还可以嵌套其他组件,如图片、图标等,并提供了丰富的属性和事件来增强交互性。

基本用法

<template><view><button type="primary" @click="handleClick">点击我</button></view>
</template><script>
export default {methods: {handleClick() {console.log('按钮被点击了');}}
};
</script>

属性说明

  • type: 按钮的样式类型,可选值包括 primary(主色调)、default(默认样式)、warn(警告色)。默认为 default

    示例:

    <button type="primary">主要按钮</button>
    <button type="default">默认按钮</button>
    <button type="warn">警告按钮</button>
    
  • size: 按钮大小,可选值有 default(默认大小)、mini(小尺寸)。

    示例:

    <button size="default">默认大小</button>
    <button size="mini">小型按钮</button>
    
  • plain: 是否镂空,即背景透明,默认为 false

    示例:

    <button plain>镂空按钮</button>
    
  • disabled: 是否禁用,默认为 false

    示例:

    <button disabled>禁用按钮</button>
    
  • loading: 是否显示加载图标,默认为 false

    示例:

    <button loading>加载中</button>
    

事件监听

  • @click: 点击事件。

    示例:

    <button @click="handleClick">点击事件</button>
    
    methods: {handleClick() {console.log('按钮被点击');}
    }
    

样式自定义

尽管 <button> 组件提供了多种预设样式,但你也可以通过自定义类名或内联样式来进一步定制按钮的外观。

<template><view><button class="custom-button" type="primary">自定义样式按钮</button></view>
</template><style>
.custom-button {background-color: #1AAD19;color: white;font-size: 20px;
}
</style>

注意事项

  1. 平台差异:不同平台(如微信小程序、H5等)对 <button> 的渲染可能存在细微差别,请务必进行跨平台测试。
  2. 嵌套限制:虽然 <button> 支持嵌套其他组件,但在某些平台上可能会有限制或不一致的行为。建议尽量保持简单的内容结构。
  3. 用户体验:考虑使用不同的 type 和状态(如 disabledloading)来提供更好的用户反馈。

Switch

<switch> 组件用于切换选择器(开关),允许用户在两种状态之间进行选择。

基本用法
<template><view><switch :checked="isSwitched" @change="onSwitchChange" /></view>
</template><script>
export default {data() {return {isSwitched: false,};},methods: {onSwitchChange(e) {this.isSwitched = e.detail.value;console.log('Switch状态:', this.isSwitched);}}
};
</script>
属性说明
  • checked: 开关是否被选中,默认为 false
  • type: 样式类型,可选值 switchcheckbox,默认是 switch
  • color: switch 打开时的背景色。
  • disabled: 是否禁用,默认为 false

Input

<input> 组件用于接收文本输入或其它类型的输入(如数字、密码等)。

基本用法
<template><view><input type="text" placeholder="请输入内容" v-model="inputValue" @input="onInput" /></view>
</template><script>
export default {data() {return {inputValue: ''};},methods: {onInput(e) {console.log('输入的内容:', e.detail.value);}}
};
</script>
属性说明
  • type: 输入框类型,支持 text, number, idcard, digit, password 等。
  • placeholder: 输入框为空时占位符文本。
  • value: 输入框的初始值,可通过 v-model 实现双向绑定。
  • disabled: 是否禁用输入框,默认为 false
  • maxlength: 最大输入长度,设置为 -1 表示不限制长度。

Textarea

<textarea> 组件用于多行文本输入。

基本用法
<template><view><textarea placeholder="请输入多行文本" v-model="textareaValue" @input="onTextareaInput"></textarea></view>
</template><script>
export default {data() {return {textareaValue: ''};},methods: {onTextareaInput(e) {console.log('输入的多行文本:', e.detail.value);}}
};
</script>
属性说明
  • placeholder: 文本区域为空时显示的提示信息。
  • value: 文本区域的初始值,同样可以通过 v-model 实现双向数据绑定。
  • auto-height: 是否自动增高,默认为 false。如果设置为 true,则可以根据输入内容自动调整高度。
  • disabled: 是否禁用文本区域,默认为 false
  • maxlength: 最大输入长度,设置为 -1 表示无限制。

uniapp组件的显示类型

在UniApp中,组件的显示类型(行内、块级等)和HTML标准元素类似,但也有其特定的组件库。

块级组件

这些组件默认情况下占据父容器的整个宽度,并且独占一行。

组件名称描述
<view>类似于HTML中的<div>,是最常用的布局容器组件。
<scroll-view>提供滚动功能的容器组件,可以设置竖向或横向滚动。需要设定固定的高度或宽度来实现滚动效果。
<swiper>轮播图组件,用于实现图片或内容的轮播切换。

行内组件

这些组件不会独占一行,而是与其他行内组件并排显示。

组件名称描述
<text>类似于HTML中的<span>,用于包裹文本内容。支持文本换行等特性。
<rich-text>用于展示富文本内容。

行内块级组件

这些组件既具有行内元素的特点又具备块级元素的一些特性,比如可以设置宽高。

组件名称描述
<button>按钮组件,可直接使用或嵌套其他组件。
<input>输入框组件,包括文本输入框、密码输入框等。
<image>图片组件,用于展示图像。

特殊组件

还有一些组件因其特殊用途而不能简单归类为上述任意一种显示类型。

组件名称描述
<navigator>页面导航组件,用于页面之间的跳转。
<video>视频播放组件。

相关文章:

uniapp常用组件

写在前面 今天将uniapp中的组件都过了一遍&#xff0c;上手难度不大&#xff0c;但是还是遇到了一些问题&#xff1a; HBuilder实在是太难用&#xff0c;不管是插件生态还是设计之类的&#xff0c;总之就是用的哪哪不顺手虽然打开内置浏览器是挺方便的&#xff0c;但是不知道…...

Oracle OCP认证没落了吗?

Oracle OCP认证没落了吗? Oracle的OCP认证是数据库领域必考的一个认证&#xff0c;但随着国产化的发展&#xff0c;国内很多企业开发了自己的数据库产品&#xff0c;这种情况对很多人造成了错误的认识&#xff1a;OCP被淘汰了吗?不然&#xff0c;从行业需求、技术趋势、认证体…...

洛谷 P3986 斐波那契数列

P3986 斐波那契数列 题目描述 定义一个数列&#xff1a; f ( 0 ) a , f ( 1 ) b , f ( n ) f ( n − 1 ) f ( n − 2 ) f(0) a, f(1) b, f(n) f(n - 1) f(n - 2) f(0)a,f(1)b,f(n)f(n−1)f(n−2) 其中 a, b 均为正整数&#xff0c;n ≥ 2。 问有多少种 (a, b)&…...

使用fastapi部署stable diffusion模型

使用vscode运行stable diffusion模型&#xff0c;每次加载模型都需要10分钟&#xff0c;为算法及prompt调试带来了极大麻烦。使用jupyter解决自然是一个比较好的方案&#xff0c;但如果jupyter由于种种原因不能使用时&#xff0c;fastapi无疑成为了一个很好的选择。 参考github…...

PyTorch使用(3)-张量类型转换

文章目录 张量类型转换1. 张量转换为 numpy 数组1.1. 默认行为&#xff1a;共享内存1.2. 避免内存共享1.2.1. 使用 .copy()1.2.2. 使用 torch.clone() .numpy() 1.3. 处理 GPU 张量1.4. 分离梯度跟踪1.5. 代码示例1.6. 关键注意事项1.7. 总结 2. 标量张量和数字的转换2.1. tor…...

基于FPGA的DDS连续FFT 仿真验证

基于FPGA的 DDS连续FFT 仿真验证 1 摘要 本文聚焦 AMD LogiCORE IP Fast Fourier Transform (FFT) 核心,深入剖析其在 FPGA 设计中的应用。该 FFT 核心基于 Cooley - Tukey 算法,具备丰富特性,如支持多种数据精度、算术类型及灵活的运行时配置。文中详细介绍了其架构选项、…...

【Spring 默认是否管理 Request 和 Session Bean 的生命周期?】

要测试 Spring 默认是否管理 Request 和 Session 作用域的 Bean 的生命周期&#xff0c;可以通过以下步骤实现&#xff1a; 验证 Spring 是否创建了 Bean&#xff1a;检查 Spring 容器是否成功加载并管理了 Request 和 Session 作用域的 Bean。验证 Bean 的生命周期回调方法是…...

Git的基本指令

一、回滚 1.git init 在项目文件夹中打开bash生成一个.git的子目录&#xff0c;产生一个仓库 2.git status 查看当前目录下的所有文件的状态 3.git add . 将该目录下的所有文件提交到暂存区 4.git add 文件名 将该目录下的指定文件提交到暂存区 5.git commit -m 备注信…...

【微信小程序(云开发模式)变通实现DeepSeek支持语音】

整体架构 前端&#xff08;微信小程序&#xff09;&#xff1a; 使用微信小程序云开发能力&#xff0c;实现录音功能。将录音文件上传到云存储。调用云函数进行语音识别和 DeepSeek 处理。界面模仿 DeepSeek&#xff0c;支持文本编辑。 后端&#xff08;云函数 Node.js&#…...

前端使用 crypto-js库AES加解密

前端使用 crypto-js库AES加解密 为什么需要前端加密&#xff1f; 现在项目使用http协议&#xff0c;且登录界面的用户登录密码是明文传输&#xff0c;项目真正上线后&#xff0c;存在信息泄露风险。 所以准备用前端框架加密处理用户输入的密码再传输。 crypto-js 库 crypto…...

七天MySQL密集学习计划

七天MySQL密集学习计划 第1天&#xff1a;MySQL基础和环境搭建 上午&#xff08;理论安装&#xff09; 数据库基本概念MySQL是什么关系型数据库基础安装MySQL Windows/Mac下安装步骤MySQL Workbench安装 基本配置和连接 下午&#xff08;基础操作&#xff09; 数据库和表的…...

Python程序常用的配置文件格式及例子(上)

Python 中常用的配置文件格式有多种&#xff0c;每种格式都有其特点和适用场景。以下是常见的配置文件类型及简要说明&#xff1a; 1. INI 格式 特点&#xff1a;简单键值对&#xff0c;支持分节&#xff08;Section&#xff09;。文件扩展名&#xff1a;.ini, .cfgPython 库&…...

Go语言对于MySQL的基本操作

一.下载依赖 终端中输入&#xff1a; go get -u github.com/go-sql-driver/mysql 导入包 import ("database/sql"_ "github.com/go-sql-driver/mysql" ) 二.案例 package main//go get-u github.com/go-sql-driver/mysql 获取驱动 import ("databa…...

一键批量txt转DWG,DWG转txt——插件实现 CAD c#二次开发

如下图&#xff0c;我们有大量dwg需要转为txt格式&#xff0c;或txt格式坐标需要转为dwg格式&#xff0c;此插件可一键完成一个文件夹下所有文件的转换。 插件使用方式 命令行输入&#xff1a; netload 加载此dll插件&#xff0c; 输入&#xff1a; dwg2txt 可将dwg转为t…...

SpringBoot 集成 Minio (附带工具类)

Minio 官方文档&#xff1a; https://www.minio.org.cn/docs/minio/container/index.html MinIO是一个对象存储解决方案&#xff0c;它提供了与Amazon Web Services S3兼容的API&#xff0c;并支持所有核心S3功能。 MinIO有能力在任何地方部署 - 公有云或私有云&#xff0c;裸…...

图论——Prim算法

53. 寻宝(第七期模拟笔试) 题目描述 在世界的某个区域,有一些分散的神秘岛屿,每个岛屿上都有一种珍稀的资源或者宝藏。国王打算在这些岛屿上建公路,方便运输。 不同岛屿之间,路途距离不同,国王希望你可以规划建公路的方案,如何可以以最短的总公路距离将 所有岛屿联通…...

Linux系统上后门程序的原理细节,请仔细解释一下

在Linux系统上&#xff0c;后门程序通常通过隐蔽的方式绕过正常的安全机制&#xff0c;允许攻击者未经授权访问系统。以下是其工作原理的详细解释&#xff1a; 1. 隐蔽性 隐藏进程&#xff1a;后门程序常通过修改进程列表或使用rootkit技术隐藏自身&#xff0c;避免被ps、top…...

Cursor与Blender-MCP生成3D模型

随着DeepSeek的热度&#xff0c;各行各业接入AI智能&#xff0c;当然作为一个深受3D爱好者喜爱的软件——Blender&#xff0c;也接入了AI智能&#xff0c;通过Blender-MCP&#xff0c;开启一场Blender的智能化模型创建的世界之旅。 目录 1.准备工作2.环境配置2.1 Mac安装2.2 W…...

Object 转 JSONObject 并排除null和““字符串

public static JSONObject objToJSONObject(Object obj) throws Exception{//创建一个 HashMap 对象 map&#xff0c;用于存储对象的属性名和属性值。//key 是属性名&#xff08;String 类型&#xff09;&#xff0c;value 是属性值&#xff08;Object 类型&#xff09;Map<…...

物联网为什么用MQTT不用 HTTP 或 UDP?

先来两个代码对比&#xff0c;上传温度数据给服务器。 MQTT代码示例 // MQTT 客户端连接到 MQTT 服务器 mqttClient.connect("mqtt://broker.server.com:8883", clientId) // 订阅特定主题 mqttClient.subscribe("sensor/data", qos1) // …...

LeetCode135☞分糖果

关联LeetCode题号135 本题特点 贪心两次遍历&#xff0c;一次正序遍历&#xff0c;只比较左边&#xff0c;左边比右边大的情况 i-1 i一次倒序遍历&#xff0c;只比较右边的&#xff0c;右边比左边大 i1 i 本题思路 class Solution:def candy(self, ratings: List[int]) -&g…...

YOLO魔改之频率分割模块(FDM)

目标检测原理 目标检测是一种将目标分割和识别相结合的图像处理技术,旨在从图像中定位并识别特定目标。深度学习方法,如Faster R-CNN和YOLO系列,已成为主流解决方案。这些方法通常采用两阶段或单阶段策略,通过卷积神经网络(CNN)提取特征并进行分类和定位。 在小目标检测中…...

AI学习——卷积神经网络(CNN)入门

作为人类&#xff0c;我们天生擅长“看”东西&#xff1a;一眼就能认出猫狗、分辨红绿灯、读懂朋友的表情……但计算机的“眼睛”最初是一片空白。直到卷积神经网络&#xff08;CNN&#xff09;​的出现&#xff0c;计算机才真正开始理解图像。今天&#xff0c;我们就用最通俗的…...

【资源损坏类故障】:详细了解坏块

目录 1、物理坏块与逻辑坏块 1.1、物理坏块 1.2、逻辑坏块 2、两个坏块相关的参数 2.1、db_block_checksum 2.2、db_block_checking 3、检测坏块 3.1、告警日志 3.2、RMAN 3.3、ANALYZE 3.4、数据字典 3.5、DBVERIFY 4、修复坏块 4.1、RMAN修复 4.2、DBMS_REPA…...

Django系列教程(13)——Cookie和Session应用场景及案例

目录 什么是cookie&#xff0c;cookie的应用场景及缺点 Django中如何使用cookie Cookie使用示例 什么是session及session的工作原理 Django中如何使用会话session Session使用示例 小结 HTTP协议本身是”无状态”的&#xff0c;在一次请求和下一次请求之间没有任何状态保…...

给管理商场消防安全搭建消防安全培训小程序全过程

一、需求沟通 “我是管理商场消防安全的嘛&#xff0c;做这个的作用呢&#xff0c;1是商场的所有商户员工可以看平面或者视频随时自学&#xff0c; 2是我们定期培训必修课程、考试&#xff0c;这个需要留存他们的手签字的签到表确认我们讲给他们听了&#xff08;免责很重要&am…...

YOLOv11 目标检测

本文章不再赘述anaconda的下载以及虚拟环境的配置&#xff0c;博主使用的python版本为3.8 1.获取YOLOv11的源工程文件 链接&#xff1a;GitHub - ultralytics/ultralytics: Ultralytics YOLO11 &#x1f680; 直接下载解压 2.需要自己准备的文件 文件结构如下&#xff1a;红…...

数据库原理实验报告:Powerdesigner建模E-R模型并转换表

注&#xff1a;此实验并不完整&#xff0c;仅供参考&#xff0c;如需完整版请私我留言 一、实验目的&#xff1a; 二、实验工具&#xff1a; 三、实验要求&#xff1a; 四、实验过程&#xff1a; 图文并茂&#xff0c;每一步都包含详细图片&#xff0c;总共11页word&#xff01…...

【愚公系列】《高效使用DeepSeek》018-错题本整理

🌟【技术大咖愚公搬代码:全栈专家的成长之路,你关注的宝藏博主在这里!】🌟 📣开发者圈持续输出高质量干货的"愚公精神"践行者——全网百万开发者都在追更的顶级技术博主! 👉 江湖人称"愚公搬代码",用七年如一日的精神深耕技术领域,以"…...

面试八股 —— Redis篇

重点&#xff1a;缓存 和 分布式锁 缓存&#xff08;穿透&#xff0c;击穿&#xff0c;雪崩&#xff09; 降级可作为系统的保底策略&#xff0c;适用于穿透&#xff0c;击穿&#xff0c;雪崩 1.缓存穿透 2.缓存击穿 3.缓存雪崩 缓存——双写一致性 1.强一致性业务&#xff08…...

maven的安装配置

目录 一、官网下载压缩包 二、配置环境变量 设置 MAVEN_HOME 添加 MAVEN_HOME\bin 到 PATH 三、配置本机仓库和远程仓库 四、配置idea 一、官网下载压缩包 Download Apache Maven – Maven 如上图。选择这个压缩包 选择好文件&#xff0c;下载完后&#xff0c;配置环境变…...

SpringCloud系列教程(十四):Sentinel持久化

Sentinel之前已经搭建和应用成功了&#xff0c;但是它有一个很大的缺点就是官方没有提供持久化的方案&#xff0c;从项目源码上看感觉这款工具也没有完成的太好&#xff0c;所以需要我们去对它进行二次开发。要补充的功能大概如下&#xff1a; 1、将Sentinel接入nacos中&#…...

深度学习处理时间序列(1)

不同类型的时间序列任务 时间序列&#xff08;timeseries&#xff09;是指定期测量获得的任意数据&#xff0c;比如每日股价、城市每小时耗电量或商店每周销售额。无论是自然现象&#xff08;如地震活动、鱼类种群的演变或某地天气&#xff09;还是人类活动模式&#xff08;如…...

微前端 qiankun vite vue3

文章目录 简介主应用 qiankun-main vue3 vite子应用 qiankun-app-vue2 webpack5子应用 qiankun-react webpack5子应用 quankun-vue3 vite遇到的问题 简介 主要介绍以qiankun框架为基础&#xff0c;vite 搭建vue3 项目为主应用&#xff0c;wepack vue2 和 webpack react 搭建的…...

【ArduPilot】Windows下使用Optitrack通过MAVProxy连接无人机实现定位与导航

Windows下使用Optitrack通过MAVProxy连接无人机实现定位与导航 配置动捕系统无人机贴动捕球配置无人机参数使用MAVProxy连接Optitrack1、连接无人机3、设置跟踪刚体ID4、校正坐标系5、配置IP地址&#xff08;非Loopback模式&#xff09;6、启动动捕数据推流 结语 在GPS信号弱或…...

【GPT入门】第24课 langfuse介绍

【GPT入门】第24课 langfuse介绍 1. langfuse概念与作用2. 代码3. 页面效果4. 设计模式1. 装饰器模式2. 上下文管理模式1. langfuse概念与作用 Langfuse是一款专为大规模语言模型(LLM)应用开发设计的开源平台。其作用主要包括以下几个方面: 提升开发效率:通过消除LLM应用构…...

基于javaweb的SpringBoot食品溯源系统设计与实现(源码+文档+部署讲解)

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

SVN简明教程——下载安装使用

SVN教程目录 一、开发中的实际问题二、简介2.1 版本控制2.2 Subversion2.3 Subversion的优良特性2.4 工作原理2.5 SVN基本操作 三、Subversion的安装与配置1. 服务器端程序版本2. 下载源码包3. 下载二进制安装包4. 安装5. 配置版本库① 为什么要配置版本库&#xff1f;② 创建目…...

AJAX的理解和原理还有概念

你想问的可能是 AJAX&#xff08;Asynchronous JavaScript and XML&#xff09; &#xff0c;它并不是一门新的编程语言&#xff0c;而是一种在无需重新加载整个网页的情况下&#xff0c;能够与服务器进行异步通信并更新部分网页的技术。以下从基本概念、原理、优点、使用场景等…...

利用AI让数据可视化

1. 从问卷星上下载一份答题结果。 序号用户ID提交答卷时间所用时间来源来源详情来自IP总分1、《中华人民共和国电子商务法》正式实施的时间是&#xff08;&#xff09;。2、&#xff08;&#xff09;可以判断企业在行业中所处的地位。3、&#xff08;&#xff09;是指店铺内有…...

FOC——Butterworth (巴特沃斯)数字滤波器(2025.03.18)

参考链接1: [DSP] Butterworth &#xff08;巴特沃斯&#xff09;数字滤波器设计参考 参考链接2: 陈佩青《数字信号处理教程》 参考链接3: ButterWorthFIlter(巴特沃斯滤波器) 在此感谢各位前辈大佬的总结&#xff0c;写这个只是为了记录学习大佬资料的过程&#xff0c;内容基本…...

Redis如何实现持久化

Redis如何实现持久化 Redis默认将所有数据存储在内存中&#xff0c;虽然读写效率极高&#xff0c;但存在两大风险 数据易失性&#xff1a;进程重启或服务器宕机导致内存数据丢失。恢复成本高&#xff1a;无法直接通过内存重建大规模数据集。 Redis作为高性能的键值数据库&…...

docker安装rabbitmq并配置hyperf使用

为满足您的高标准需求&#xff0c;我将分步骤为您详细解释如何通过Docker安装RabbitMQ服务器&#xff0c;并展示如何配置PHP的Hyperf框架来使用RabbitMQ。 安装RabbitMQ&#xff1a; 获取RabbitMQ镜像在终端中运行以下命令来拉取RabbitMQ的官方Docker镜像&#xff1a; docker …...

极空间NAS部署gitea教程

极空间NAS部署gitea步骤教程 背景1. 准备镜像1.1 极空间官方1.2 Win系统docker再上传1.3 镜像转录 2. MySql配置2.1 容器配置2.2 命令行配置 3. gitea配置3.1 容器配置3.2 打开网页3.3 网页配置安装 参考资料 背景 极空间Nas和别的Nas不同的地方就在于&#xff0c;他不是那种标…...

大模型学习-从零开始在colab训练大模型

目录 写这篇文章的目的 1.准备训练所需的文件 2.将压缩包上传到谷歌云盘 使用colab 3.训练 写这篇文章的目的 这篇文章是对&#xff1a;大模型学习-在colab中训练并更换模型_colab调整模型-CSDN博客的一个优化&#xff0c;因为在之前的博文中&#xff0c;我是提供了一个现…...

【商城实战(38)】Spring Boot:从本地事务到分布式事务,商城数据一致性的守护之旅

【商城实战】专栏重磅来袭&#xff01;这是一份专为开发者与电商从业者打造的超详细指南。从项目基础搭建&#xff0c;运用 uniapp、Element Plus、SpringBoot 搭建商城框架&#xff0c;到用户、商品、订单等核心模块开发&#xff0c;再到性能优化、安全加固、多端适配&#xf…...

漏洞知识点《PHP数组绕过深入解析》

在PHP中&#xff0c;通过数组绕过安全限制的核心原理与PHP语言特性和底层实现机制密切相关。以下是具体原因及技术细节分析&#xff1a; 一、PHP参数解析机制的特性 PHP的$_GET、$_POST等超全局变量支持将用户输入自动解析为数组。例如&#xff0c;通过URL参数?username[0]a…...

【极光 Orbit·STC8x】05. GPIO库函数驱动LED流动

【极光 OrbitSTC8】05. GPIO库函数驱动LED流动 七律 逐光流转 八灯列阵若星河&#xff0c;状态为舟渡长波。 寄存器中藏玄机&#xff0c;Switch语句定山河。 循环往复如潮涌&#xff0c;步骤变量掌沉浮。 单片机前展锋芒&#xff0c;代码织就光之舞。 摘要 本文基于STC8H8K6…...

SSH配置过程及无法正常链接问题的解决【小白教学】

1.尝试克隆github上的项目&#xff0c;发现无法正常下载【之前有些是可以的】 git clone https://github.com/mogualla/PythonRobotics.git --depth 3 出现下面的提示【错误】&#xff1a; Cloning into PythonRobotics... fatal: unable to access https://github.com/mogua…...

总结 HTTP 协议的基本格式, 相关知识以及抓包工具fiddler的使用

目录 1 HTTP是什么 2 HTTP协议格式 3 HTTP请求(Request) 3.1 认识URL 3.2 方法 3.3 认识请求"报头"(header) 3.3.1 Host 3.3.2 Content-Length 3.3.3 Content-Type 3.3.4 User-Agent (简称UA) 3.3.5 Referer 3.3.6 Cookie和Session 4 HTTP响应详解 4.…...