- 博客(127)
- 收藏
- 关注
原创 什么是Web Worker?如何使用Web Worker?
JavaScript 语言采用的是单线程的,也就是说,所有任务只能在一个线程上完成,一次只能做一件事。前面的任务没做完,后面的任务只能等着。是一种,允许在后台线程中执行脚本,从而避免长时间运行的脚本阻塞用户界面。Web Worker 的作用,就是。在主线程运行的同时,Worker 线程在后台运行,两者互不干扰。等到 Worker 线程完成计算任务,再把结果返回给主线程。主线程与 Worker 之间的通信内容,
2024-11-27 14:01:59 1008
原创 【react】Redux基础用法
Redux 是一个用于 JavaScript 应用的状态管理库,它不依赖于任何 UI库,但常用于与 React 框架配合使用。它提供了一种集中式的状态管理方式,将应用的所有状态保存在一个单一的全局 Store(存储)中,使得状态的变化和共享变得更加可控和可预测。✨Redux 的核心概念:StoreRedux 的 Store 是一个对象,存储了应用的全部状态。应用中只有一个 Store,作为单一数据源。任何组件需要访问状态时都会从这个 Store 中获取数据。ActionAction 是一个简单的 Jav
2024-11-05 08:18:38 1202
原创 【react】基础知识点学习
useState是一个 React Hook(函数),它允许我们向组件添加一个状态变量,从而控制影响组件的渲染结果。也就是当数据发生变化时,页面也会跟着变化。
2024-10-30 10:59:47 1180
原创 基础教程 | 用VuePress搭建一个简单的个人博客(附源码)
用VuePress搭建一个简单的个人博客基础教程,基础版和美化版风格 (附源码)
2024-10-09 13:44:57 1475 2
原创 使用原生HTML的drag实现元素的拖拽
HTML 拖放(Drag and Drop)接口使应用程序能够在浏览器中使用拖放功能。例如,用户可使用鼠标选择可拖拽(draggable)元素,将元素拖拽到可放置(droppable)元素,并释放鼠标按钮以放置这些元素。拖拽操作期间,会有一个可拖拽元素的半透明快照跟随着鼠标指针
2024-09-12 11:51:40 944
原创 Vue3.5正式上线,有哪些新特性和用法?
9月1日, Vue 3.5 正式发布了!此次要版本不包含重大更改,并且包括内部改进和有用的新功能。我们将在这篇博文中介绍一些亮点 - 有关更改和新功能的完整列表,请参阅 GitHub 上的完整更新日志。
2024-09-10 15:57:06 2351
原创 【基础】Three.js 自定义几何体和复制几何体
通过自定义顶点数据,可以创建任意的几何体。像threejs的长方体BoxGeometry、球体SphereGeometry等几何体都是基于BufferGeometry类构建的,它表示一个没有任何形状的空几何体。
2024-09-06 16:45:57 936
原创 【基础】Three.js加载纹理贴图、加载外部gltf格式文件
.gltf(JSON文件): 描述模型的主要结构,包括几何体、材质、动画、场景等。.bin(二进制文件): 存储顶点数据、法线、UV坐标等二进制数据。纹理(.png, .jpg): 存储模型使用的纹理贴图。。
2024-09-02 17:27:54 2256
原创 【基础】Three.js中添加操作面板,GUI可视化调试(附案例代码)
1.先引入GUI库:2.实例化gui对象,并添加需要显示的参数:3.分组案例代码:
2024-08-28 16:55:15 1356
原创 使用vueuse在组件内复用模板
如果你有一组表单元素(如输入框、下拉菜单等),并且这些元素在多个表单或多个组件中使用,createReusableTemplate 可以帮助你将这些表单元素封装为一个可复用的模板。: 如果你有一套通用的布局结构,例如卡片布局或者特定的网格布局,并且在多个组件中使用相同的结构,可以通过 createReusableTemplate 进行封装和复用。: 假设你有一个复杂的列表项结构,需要在多个地方使用,比如在主页的推荐列表和分类页的商品列表中。这对于需要在多个组件中重复使用相同的结构和逻辑时非常有用。
2024-08-27 17:32:00 675
原创 使用html2canvas将网页导出为图片
Vue 3 的 ref 用来引用 DOM 元素。我们通过 exportContent 引用需要导出的 DOM 元素。:html2canvas 库会将指定的 DOM 元素渲染为画布(canvas),然后可以通过。// backgroundColor: null, // 保留背景透明度。// 使用 html2canvas 渲染指定的 DOM 元素。将画布转换为图片的 Base64 数据 URL。// 将画布转换为图片数据 URL。方法自动触发图片的下载。// 启用跨域资源支持。// 创建一个下载链接。
2024-08-22 11:32:42 1320
原创 【css】伪元素实现图片悬停文字聚焦效果
创建两层边框效果,悬停时它们会从上下两端逐渐收缩,覆盖在图片上,形成一个视觉上的悬停突出效果。将 .box 文字盒子定位在图片上方。父容器 .img-wrap 使用了。伪元素实现半透明黑色背景层,这些伪元素在正常状态下通过。确保子元素的绝对定位在父容器的边界内生效。// 伪元素实现两层边框效果半透明黑色背景层。// 图片和文字盒子上的所有元素都有过渡效果。图片和文字盒子上的所有过渡效果都设置了。,使得在悬停时的动画效果平滑。进行隐藏,并在悬停时使用。
2024-08-21 15:04:55 736
原创 css实现闪烁渐变背景,@property自定义属性
@property是 CSS 中一个相对较新的功能,主要用于定义自定义属性(即 CSS 变量)的类型、继承性以及初始值。它允许开发者更好地控制和利用 CSS 自定义属性,尤其是在动画、过渡等动态场景中。
2024-08-20 13:54:32 771
原创 canvas实现图片像素化(可调整像素大小、替换图片)
通过调整像素大小实现图片像素化效果,也可以对图片进行替换。通过 Canvas 的 getImageData方法获取图片的像素数据。
2024-08-15 15:01:02 725
原创 ES2023(ES14)新特性有什么?
toSpliced`是一种数组操作方法,它与 splice 类似,但 toSpliced 不会修改原数组,而是返回一个新数组,包含删除和新增元素后的结果。它在操作数组时更加安全,因为不会改变原始数据。
2024-08-06 09:24:33 548
原创 css文本划线效果(text-decoration相关属性详解)
设置文本修饰线的类型,underline(在文本的下方)、overline(在文本的上方)、line-through(贯穿文本中间): 设定的线的样式,solid(直线)、double(双下划线)、dotted(点画线)、dashed(虚线)、wavy(波浪线)使用 text-decoration时,设置文本装饰下划线。设置文本上的装饰性线条的样式。设置如何绘制超出基线的字符。:设置文本修饰线的颜色。:设置文本修饰线的厚度。
2024-07-12 14:10:49 959
原创 什么是尾递归调用?
尾递归调用是一种特殊的递归形式,其中递归调用是函数的最后一个操作。尾递归将递归调用转换为迭代,从而节省函数调用栈的空间,避免栈溢出。许多编程语言和编译器能够对尾递归进行优化,称为尾递归优化。
2024-07-03 14:17:48 376
原创 桶排序的图解过程、代码实现和使用场景
桶排序是分治策略的一个典型应用。它通过设置一些具有大小顺序的桶,每个桶对应一个数据范围,将数据平均分配到各个桶中;然后,在每个桶内部分别执行排序;最终按照桶的顺序将所有数据合并。
2024-06-28 15:08:54 393
原创 SVN 报错Error: Unable to connect to a repository at URL解决方法
使用ssh 用svn拉取仓库代码时,出现如下报错:Can't create session: Unable to connect to a repository at URL 'svn://127.0.0.1 ..... Can't connect to host '127.0.0.1': Connection refused at C:/Program Files/Git/mingw64/share/perl5/Git/SVN.pm line 717.
2024-06-14 15:59:39 2948
原创 为什么javascript中数组可以存储不同类型的元素,而大多编程语言数组必须存储相同的元素?
我们都知道在Java、C++、C# 等编程语言中数组中要求相同类型的元素,而在javascript中却可以存储不同类型的元素,那这是为什么呢?
2024-06-14 10:45:35 367
原创 移动端浏览器的扫描二维码实现(vue-qrcode-reader与jsQR方式)
类似扫一扫的功能,自动识别到画面中的二维码并进行识别,也可以选择从相册中上传。vue-qrcode-reader一组用于检测和解码二维码的Vue.js组件jsQR一个纯粹的javascript二维码阅读库,该库接收原始图像,并将定位、提取和解析在其中找到的任何二维码。zxing-wasmZXing-C++ WebAssembly 作为带有类型的 ES/CJS 模块。读/写 web、node、bun 和 deno 中的条形码。安装3. 方式一:vue-qrcode-reader实现🔍vue
2024-06-11 13:55:06 5491 10
原创 Canvas的基本介绍与使用
Canvas 是 HTML5 中引入的一个重要特性,它允许网页动态渲染二维图形.。通常使用JavaScript脚本来绘制·canvas·元素。例如,它可以用于或者。是一个内联元素,默认尺寸为宽 ×高。也可以通过设置width和height属性来调整画布的大小。由于 Canvas 是基于的,所以缩放不会影响图形质量。
2024-06-04 16:47:58 907
原创 vue中视频播放器xgplayer的使用(点播与直播)
点播视频)是一种多媒体服务形式,允许用户随时随地选择并观看视频内容,而不是按照预设的时间表来观看。xgplayer是一个开源的 HTML5 视频播放器,由字节跳动公司开发并维护。它最初是为了满足短视频平台的播放需求而设计的,具有高性能和高度可定制的特点。xgplayer适用于移动设备和桌面设备,支持多种视频格式和流媒体协议,包括等。
2024-05-29 10:11:25 2832 5
原创 多张图片上传、图片回显、url路径转成File文件
背景:在表单中使用element-plus实现多张图片上传(限制最多10张),因为还要与其他参数一起上传,所以使用formData格式。编辑表单回显时得到的是图片路径数组,上传的格式是File,所以要进行一次转换。2. 踩坑记录问题:在对图片列表遍历后处理时,一开始在中进行文件格式转换操作,数据项无法插入中,但控制台打印有值。原错误写法:原因:是并发执行,在每次迭代时会立即执行指定的回调函数,并且不会等待上一次迭代的结果,所以并不能保证每次convertUrlToFile操作都已完成。解决方法
2024-05-22 14:26:26 1137
原创 grid的常见使用场景
grid的常见使用场景。场景1:固定几列显示,显示不下会自动换行。场景2:格子宽度固定, 显示几列不确定。场景3:不同列所占份数不同。场景4:有些列宽度不固定
2024-05-11 17:23:35 465
原创 使用scrollIntoView滚动元素到可视区域
scrollIntoView 是一个内置的 JavaScript 方法,用于将元素滚动到视口可见的位置。它通常用于用户界面中,以便用户能轻松看到特定的元素。此方法可以应用于任何 DOM 元素,并且有多个参数可以控制滚动行为。
2024-05-11 13:34:12 1603
原创 HTTP请求中的安全性和幂等性
HTTP请求中的安全性指的是它不会修改服务器的数据。也就是说,这是一个对服务器只读操作的方法。比如`GET`,`HEAD` 和` OPTIONS`这些方法都是安全的。所有安全的方法都是具有幂等性,但具有幂等性的方法不一定都是安全的。`PUT `和 `DELETE` 都是幂等的,但不是安全的。
2024-04-29 15:20:05 697
原创 OPTIONS 预检请求是什么?
OPTIONS 请求是 HTTP 协议中的一种请求方法。它是 HTTP/1.1 规范中引入的,属于“预检请求”(preflight request)的一部分,主要用于跨域资源共享(CORS, Cross-Origin Resource Sharing)的场景中,但也适用于其他需要了解服务器功能的场合。
2024-04-29 10:43:29 1004
原创 函数式编程之组合函数、pointfree风格
组合函数是一种函数式编程中的概念,用于将多个函数组合成一个单一的函数,其中每个函数的输出是下一个函数的输入。如果要组合多个函数来创建一个更强大的组合函数,可以使用函数的方法来组合。方法对累加器(accumulator)和数组的每个值(按从右到左的顺序)应用一个函数,并使其成为单个值。另外,组合函数运用到了,只传递给函数一部分参数来调用它,让它返回一个函数去处理剩下的参数。每次调用函数时,它只接受一部分参数,并返回一个函数,直到传递所有参数为止。
2024-04-07 14:02:04 229
原创 编译器重排是什么?
编译器重排(Compiler Reordering)是编译器在编译程序代码时进行的一种**优化操作,目的是提高程序的执行效率。在不违反代码的原有语义(即不改变程序执行结果)的前提下,编译器会对源代码中的指令顺序进行调整。
2024-03-29 16:55:47 381
原创 JavaScript中的行为委托和面向类的区别?
行为委托意味着:在访问某个对象上不存在的属性或方法时,让这个对象为属性或方法引用提供一个委托。可以多级委托,但是不能相互委托,不能在两个或多个对象间相互地委托(双向地)对方来创建一个 循环 。比如使 B 链接到 A,然后试着让 A 链接到 B。
2024-03-26 09:18:00 304
原创 表格列内容过长显示省略号,并悬浮展示信息
使用自定义指令,并判断超长的文字,悬浮提示展示信息。// 表格内容过长,显示悬浮信息。// 判断该行内容是否全部显示。
2024-03-22 09:19:05 677
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人