努力挣钱的小鑫-CSDN博客

界面代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>react-购物车案例</title> <script src="https://

2024-04-10 11:33:19 818

原创【HTML】加载 CDN 资源时遇到 Failed to find a valid digest in the ‘integrity‘ attribute for resource 报错问题

integrity 属性integrity属性用于校验脚本文件的完整性，防止脚本被篡改。它包含一个哈希值，用于验证脚本文件的真实性。浏览器会在下载脚本文件后，计算其哈希值并与integrity属性中的值进行比较。如果两者不一致，则浏览器会阻止脚本执行，并显示警告信息。crossorigin 属性属性用于控制跨域脚本的加载行为。anonymous：表示脚本文件不会携带任何凭据，例如 cookie 或 HTTP 认证信息。：表示脚本文件可以携带凭据。两者关系integrity属性和。

2024-04-10 09:45:53 351

原创【JavaScript】生成随机的十六进制颜色

【代码】【JavaScript】生成随机的十六进制颜色。

2024-03-21 16:51:31 388

原创【Nuxt】Nuxt3中监听resize事件监听窗口变化和滚动等事件

代码如下，记得加判断。

2024-03-18 16:36:08 180

原创【JavaScript】requestAnimationFrame 实现表格的流畅滚动

【代码】【JavaScript】requestAnimationFrame 实现表格的流畅滚动。

2024-03-13 11:35:48 218

原创【CSS】 css 实现文字的渐变色

【代码】【CSS】 css 实现文字的渐变色。

2024-03-13 10:23:58 442

原创【Element】Vue3 中快捷设置 Element 主题色

/ { bs_name: "chrome浏览器", bs_tag: "chrome", bs_version: "108.0.0.0" },'当前浏览器版本过低，部分功能不可用，请更新火狐浏览器版本（不低于100.x版本）'// document.documentElement 是全局变量时。// 获取 css 变量。// 设置 css 变量。// 监听浏览器版本。

2024-03-11 17:44:41 729

原创【Vue】vue3 在图片上渲染 OCR 识别后的文本框、可复制文本组件

这里要重点讲下关于OCR文本框的处理：因为一些文字可能是斜着放的，所有我们要特殊处理，根据三角函数来计算出它的偏转角度，从而旋转，所有下面的函数有点复杂，不说明怕你看不懂😂

2024-03-06 14:56:28 868

原创【Nuxt】Nuxt3 中监听 document 滚动报错 document is not defined

【代码】【Nuxt】Nuxt3 中监听 document 滚动报错 document is not defined。

2024-02-23 18:16:05 237

原创【Nuxt】在 Nuxt3 中使用 nuxt-icons 实现 icon svg 的动态变色效果

然后在代码中使用，使用组件传参就行，改颜色需要用到深度选择器，vue3 就是。自己去看官网文档就行。

2024-02-23 15:09:12 524

原创【Three】前端从零开始学习 threejs：创建第一个 threejs3D 页面

/ 创建一个材质：MeshBasicMaterial是一种简单的材质，不受光照影响。// 创建一个立方体：BoxGeometry 是一个立方体的几何体。// 创建一个立方体网格：Mesh是一个物体，它由几何体和材质组成。// 创建渲染器：渲染器将场景和相机渲染到画布上。// 创建场景：场景是所有物体的容器。// 创建相机：相机是用户眼睛。// 将相机向后移动10个单位。// 将立方体网格添加到场景中。// 将相机向上移动5个单位。// 在页面中添加渲染器。// 设置渲染器的大小。// 使立方体网格旋转。

2024-02-18 15:03:11 931

原创【前端可视化】postcss-px-to-viewport 适配怎么限制最大宽度？使用 postcss-mobile-forever

自己用 nuxt3 写官网发现用 postcss-px-to-viewport 这个插件虽然能够实现基于 vw 的响应式，但是无法做到限制宽度，比如设计稿 1920p，我只想让最大缩放比例为 1920p，不能超过，就无法实现了。纯 css 的话，有两个办法，一种用 px 生成两套代码，一套移动端的 vw 视图，一套最大宽度的媒体查询代码，另一种方法是用类似 min(vw, px) 的 css 函数限制 vw 的最大值。最后可以实现移动端、桌面端和移动端横屏都有蛮好的展示效果。有大佬已经写好了插件。

2024-01-23 10:12:28 1081

原创【JavaScript】使用 scrollIntoView 实现描点跳转定位

behavior 可选，定义滚动是立即的还是平滑的动画。auto：滚动行为由 scroll-behavior 的计算值决定。instant：滚动应该通过一次跳跃立刻发生。smooth：滚动应该是平滑的动画。

2024-01-17 13:47:51 537

原创【Element】el-input 限定输入是只能是数字和符号 -

/ 正则表达式 /[^\d+-]/g 只允许数字和加号减号，你可以根据你的需求调整这个正则表达式。// 使用正则表达式检查输入值，只允许数字和特定符号。

2024-01-15 10:18:15 715

原创【Node】nodejs 脚本批量修改文件名

批量改文件，一个js文件就搞定了，nodejs还是有用啊！刚刚手改文件名，突然想到我是程序员啊，手改是不是太傻啊。想到原来学的nodejs的时候，学到可以用。

2023-12-28 17:34:04 470

原创【Vscode】JSON to TS 插件将后端返回 json 格式数据转为 ts 类型

在我们写 ts 类型的时候，后端返回的一大堆数据，写类型，有时候是真的难受，我经常会想能不能交给插件来完成，最近刚好群友推荐了这个插件。下面是使用的例子，可以直接把 json 格式转成了标准化的 ts 类型，超级好用！使用方法也很简单，可以看它插件的介绍文档。

2023-12-28 10:41:38 1063

原创【Element】el-tree-select 限制只能同级选择

如果要选择只能清空了，选择第二层的，需求大概就是这样，不知道你听懂了没？我反正当时没听到哈哈哈😂。属性，再设置一个全局 level 变量来保存，在选择 change 事件的时候进行判断和控制。需求就是只能同时多选同一层级的，比如上面。是一层的，可以同时选，但是不能选择。核心思路就是给层级树添加个。

2023-12-27 14:04:06 474

原创【JavaScript】JS 通过 lodash 获取树结构数组的全部 id

上述代码中使用了 _.flatMap 函数来展开树结构数组，并在递归调用中提取每个节点的 ID。输出结果将会是一个包含树结构中所有节点 ID 的数组 [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]。你可以根据实际的树结构数组进行调整和应用。要使用 Lodash 获取树结构数组的全部 ID，可以使用递归函数来遍历整个树结构并提取 ID。

2023-12-25 14:28:09 697

原创【Element】el-table 使用 el-table-infinite-scroll 插件实现滚动加载

虽然 el 官方提供了组件但是缺不支持el-table组件，这就很难受了，还好已经有大佬写好了插件，并且支持组件的所有选项。

2023-12-22 15:30:29 1460

原创【JavaScript】iframe postMessage 通信

【代码】iframe postMessage 通信。

2023-12-14 09:45:24 93

原创【CSS】用 CSS 写一个渐变色边框的输入框

【代码】用 CSS 写一个渐变色边框的输入框。

2023-12-11 17:14:10 329

原创【CSS】前端点点点加载小点样式css动画过程实现

加载动画，直接用 CSS 就可以实现，样式可以自己改，逻辑大差不差。

2023-12-11 14:55:39 377

原创【Vue】Vue3 pc 端配置 rem 响应式

【代码】Vue3 pc 端配置 rem 响应式。

2023-12-11 14:21:46 333

原创【Vue】Vue3 中实现图片的帧动画方案分享

window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画，并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数，该回调函数会在浏览器下一次重绘之前执行。我最后采用的是叫 UI 换 GIF 了😁。只有麻烦下 UI 了哈哈哈哈。

2023-12-11 10:42:13 574 1

原创【Nuxt】在 Nuxt3 中使用 pinia 并做持久化处理

文件夹下创建一个 store.ts 文件，这样使用的时候就不需要再导入了。在 plugins 文件夹中添加插件。

2023-12-05 11:10:33 970

原创【Element】element-plus中el-dialog弹窗隐藏遮罩并可以控制弹窗后的元素、点击、滚动、其他事件操作等

但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可以指向后代元素，在这种情况下，鼠标事件将在捕获或冒泡阶段触发父元素的事件侦听器。从 dom 元素我们知道 el-dialog 的层级为三层，外面两层是遮罩，第三层才是真正的弹窗元素，因此，我们需要做的就是把外层最外层的遮罩事件去掉，保留最里面的。el-dialog 隐藏遮罩并且可以控制弹窗后的元素、点击、滚动、其他事件操作，比如一个弹窗打开了，我要能控制弹窗后面的滚动、点击等等一系列事件。首先我们需要隐藏弹窗遮罩。

2023-11-29 13:56:40 2216