- 博客(193)
- 收藏
- 关注
RSS订阅原创 Windows 下 pnpm dev 报错：spawn esbuild.exe ENOENT（pnpm workspace / monorepo）
环境：Windows 10/11 + pnpm workspace（monorepo）+ Vite现象：执行 pnpm dev 直接退出，报 esbuild.exe ENOENT。
2025-12-24 17:53:02
303
原创 解决windows11系统安装python后执行python --version没反应
方法：控制面板 → 系统 → 高级系统设置 → 环境变量 → 选“Path”（用户变量）→ 新建以上两行，并把它们拖到。是因为被 Windows 的 “应用执行别名”(App Installer) 或 PATH 顺序拦截了。（发布者一般是 App Installer 或 Microsoft Store）都关闭。设置 → 应用 →高级应用设置 →应用执行别名 → 把。然后新开一个命令行窗口。安装成功了，命令行执行。
2025-12-08 18:12:26
355
原创 Python 入门学习
那如果要判断多个条件的话，可以使用 elif。假如我们要给考试分数评个优良中差，可以这么写。的变量名支持字母、下划线、数字。但不能在变量名里加入空格，不能以数字开头。条件运算符通常会配合前面说的条件判断一起使用。这里的序列可以是列表，也可以是字符串。里的条件运算符有“与、或、取反”。是按照缩进来划分代码块的。无法单独使用，它必须跟着。
2025-12-07 23:15:31
242
原创 iOS系统 点击输入框页面放大的原因与解决方案
为了让页面稳定，不仅要为 、设置 font-size: 16px，也要为 contenteditable元素也设置相同的字体大小，否则这些可编辑区域也可能触发 iOS 的放大机制，这样就能确保：输入框以及可编辑的 div 或 span 区块不会触发 iOS 的自动放大行为。输入框字体小于 16px：iOS Safari 会在输入框聚焦时自动放大，以便阅读与输入，通常当字号小于 16px 更容易触发该行为。保证可聚焦元素的字号不小于 16px。
2025-11-21 14:42:09
85
原创 el-tabs实现 切换区域（即标签页头部）固定，而内容区域可滚动
* 让整个 tabs 组件内部布局保持正常，但利用 sticky 固定标签栏 *//* 关键：让 el-tabs 的标签部分（tab bar）固定在顶部 *//* 内容区域自动撑开并可以滚动（如果整体容器有固定高度） *//* 重点：通过子选择器固定标签栏部分 */// 定义响应式数据：当前激活的标签页。/* 避免透明背景导致内容透出 *//* 可根据需求设置内容样式 *//* 或者你希望的容器高度 *//* 可选，增加分隔线 *//* 内容可滚动 */
2025-11-16 22:58:24
580
原创 AntV L7如何管理多个 Marker 并通过名字删除指定marker
需求解决方案动态定义 Marker 的名字使用 extData: { name: ‘my_marker’ }后续通过名字操作 Marker自己维护一个 markerMap = { ‘name’: marker }对象来管理移除指定名字的 Marker通过 markerMap[‘name’].remove()移除L7 是否有内置 name 属性？没有，但可通过 extData扩展。
2025-11-07 15:28:52
201
原创 .gitignore配置了忽略dist文件夹，但是souretree还是跟踪了dist文件夹的变化怎么解决
如果在.gitignore中配置了忽略 dist文件夹，但 SourceTree仍然显示 dist文件夹的变更，通常是因为 dist文件夹已经被 Git 跟踪了。.gitignore只对未被跟踪的文件和文件夹生效，对于已经被 Git 纳入版本控制的文件/文件夹，.gitignore不会自动让它们“停止被跟踪”。要解决这个问题，需要先让 Git “忘记” 对 dist文件夹的跟踪，然后再提交.gitignore的变更。
2025-10-31 17:31:15
385
原创 flex:1 和 flex:auto 有什么区别？
👉 如果你把其中一个设为 flex: 1，另一个设为 flex: auto，你会发现 flex: 1的那个会尽可能占满剩余所有空间，无论另一个的内容有多少。通过一个简单的 HTML + CSS 示例来看它们的不同表现。
2025-10-19 18:38:51
643
原创 解决git bash报错Error: Could not fork child process: There are no available terminals (-1)
注：如果打开还是报错，执行tasklist查看是否还有git相关进程，有的话杀掉，直到执行tasklist没有任何git相关进程，就可以正常打开了。因为在执行git pull的过程中，误关闭了git bash对话框，再次打开git bash对话框时，出现一下报错。4.杀掉进程：taskkill /pid 10124 -t -f。再次打开git bash就可以正常运行了。2.查看所有进程：tasklist。3.找到所有git相关进程号。
2025-09-23 16:52:37
333
原创 深入理解 svh、lvh、dvh—— 移动端视口高度解决方案
CSS Working Group 引入了动态视口单位：svh、lvh、dvh，它们能够根据浏览器 UI（如导航栏、工具栏）的显隐状态，动态调整视口高度的基准值，从而让布局更加精准、体验更加流畅。在桌面端浏览器中，它通常没有问题。当页面加载时，浏览器通常会显示 顶部的导航栏/地址栏，此时 可视区域较小；当用户向下滚动页面时，地址栏通常会 自动隐藏，此时 可视区域变大；表示 浏览器 UI（如地址栏、工具栏）显示时 的最小视口高度。
2025-09-14 21:23:36
1181
原创 关于npm的钩子函数
但除了你显式定义的 build脚本本身，npm 还会在脚本执行 前后 自动触发一些 生命周期钩子（Lifecycle Hooks），这些钩子是 npm 内置的机制，在特定阶段自动运行。npm 提供了一些 特殊的 script 名称，它们是 生命周期钩子，会在特定时机 自动执行。npm 提供了一些 特殊的 script 名称，它们是 生命周期钩子，会在特定时机 自动执行。1.prebuild（如果定义了）→ 在运行 build之前执行。
2025-09-07 23:55:01
941
原创 CSS flex-basis 属性详解：功能、用法与最佳实践
flex-basis 属性用于指定弹性项目在主轴方向上的初始大小。当元素被设置为弹性项目(即位于 display: flex 或 display: inline-flex 的容器内)时，flex-basis 才会生效。
2025-06-13 16:01:26
1319
原创 前端脱敏展示姓名、手机号、邮箱
邮箱只显示第一个字符、@及@后面的内容，中间用 * 替代，如“1****@163.com”手机号展示前3位和后4位，中间用 * 替代，如“139****1234”姓名只显示第一个字，如“张*”、“王**”
2025-06-06 14:12:38
316
原创 const ‘不可变’到底是值不变还是地址不变
包括：Number、String、Boolean、Undefined、Null、Symbol（ES6新增）、BigInt（ES2020新增）。它们的特点是：直接存储在内存栈中。复杂数据类型（如Object、Array、Function）的存储方式不同：变量在栈中存储堆内存地址，实际数据存放在内存堆中。
2025-05-30 15:29:22
405
原创 el-input宽度自适应方法总结
最常用的方法是直接设置 el-input 的宽度为 100%，或者通过 flex 布局来实现自适应。如果在 el-form 中使用 el-input，可以通过 label-width 来控制输入框的宽度。根据具体的布局需求，选择合适的方法来实现宽度自适应。
2025-05-23 16:46:36
1752
原创 querySelectorAll 和 getElementByClassName 的区别是啥
HTMLCollection（getElementsByClassName）是动态的，而 NodeList（querySelectorAll）是静态的。
2025-05-16 15:18:00
408
原创 getBoundingClientRect()的理解
是 JavaScript 中 DOM 元素的一个非常有用的方法，它用于获取元素的大小及其相对于视口（viewport）的位置。以及一些其他可能由浏览器实现的属性。
2025-04-18 17:09:47
359
原创 Vue 3中的 setup
Vue 3引入了Composition API，其中setup函数是这一新API的核心部分。setup函数为开发者提供了一种更灵活、更模块化的方式来组织组件逻辑。
2025-04-11 16:40:43
532
原创 vue3+element-plus+el-tree-v2实现节点过滤
需求：通过输入框输入关键字，动态过滤树形节点，只显示匹配的节点及其父节点。// 对树形数据进行深拷贝，避免修改原始数据。// 检查 node.label 是否存在。// 如果子节点有匹配项，保留当前节点。// 如果过滤条件为空，返回完整数据。// 如果当前节点匹配，保留。// 树形结构的属性配置。// 过滤后的树形数据。// 递归过滤树形数据。// 不匹配的节点移除。'三级 1-1-1''三级 1-1-2'// 递归过滤子节点。
2025-03-21 16:18:12
1104
原创 setTimeout 和 setInterval 做倒计时不精准的解决办法
requestAnimationFrame 通常用于动画，但也可用于高精度计时。它会在每次浏览器重绘前调用回调，频率通常为 60Hz（约 16.67ms）。performance.now() 提供高精度时间戳（微秒级），
2025-03-14 17:54:29
638
原创 requestAnimationFrame 和定时器的含义，使用场景及区别
requestAnimationFrame和定时器都是JavaScript中用于控制代码执行时机的工具，但它们在实现原理、应用场景以及性能表现上存在显著差异。
2025-03-07 19:45:00
797
原创 el-switch切换之前二次确认
点击el-switch开关按钮，弹窗提示“是否确定切换”，点击“是”，改变开关状态，点击“否”，不改变开关状态。//点击“是”，改变开关状态。
2025-02-28 17:45:37
584
原创 如何判断元素在可视化区域内
判断元素是否在可视区域内，我们可以使用JavaScript提供的几种方法来实现。以下是一个更具体的说明，包括使用getBoundingClientRect方法和Intersection Observer API的详细步骤。
2025-02-21 17:37:24
390
原创 为什么vue3需要对引入的组件使用markRaw？
在Vue 3中，对引入的组件使用markRaw的主要原因是为了避免Vue的响应式系统对该组件实例进行不必要的代理和追踪。Vue 3的响应式系统是基于Proxy实现的，它会对数据进行代理以追踪其变化，并在数据变化时自动更新视图。然而，在某些情况下，组件实例并不需要被转换成响应式对象，因为这样做可能会带来额外的性能开销，甚至可能导致潜在的问题。
2025-02-14 17:29:26
525
原创 解决Element Plus el-date-picker组件清空时，触发两次change的问题
这种方案适合所有时间范围选择（daterange、datetimerange、monthrange、yearrange），但考虑到 JavaScript 是单线程的，如果在指定的时间点上有大量代码正在执行，setTimeout 里的函数可能会被延迟执行。每一个 setTimeou t都是在增加一个新的JavaScript任务，会影响浏览器主线程，导致界面响应变慢。当用户选择了范围的开始时，会立即触发一次 change 事件。而当用户选择了范围的结束时，又会触发一次 change 事件。
2025-01-17 11:27:23
280
原创 Vue的scoped原理是什么
使用 scoped 后，父组件的样式将不会渗透到子组件中。不过，子组件的根节点会同时被父组件的作用域样式和子组件的作用域样式影响。这样设计是为了让父组件可以从布局的角度出发，调整其子组件根元素的样式。属性，可以轻松实现样式的局部作用域，确保样式仅应用于当前组件，从而避免全局污染。此外，Vue的单文件组件还支持。在上边的代码中， Vue编译器给组件中DOM元素和CSS各自都添加一个相同且唯一的属性选择器如。Vue编译器会转换这些深度选择器，以便能够穿透组件边界。在Vue中，样式设置通常是在单文件组件的。
2025-01-11 15:02:51
1066
原创 vue3中mixins替代方案
自定义 Hooks 是一种基于函数的代码复用方式，可以在 setup 函数中使用。它允许将组件的逻辑分割成更小的、可复用的部分。});
2025-01-03 16:13:30
965
原创 Vue3 Suspense：处理异步渲染过程
Suspense>是一个内置组件，用来在组件树中协调对异步依赖的处理。它让我们可以在组件树上层等待下层的多个嵌套异步依赖项解析完成，并可以在等待时渲染一个加载状态。Vue3 Suspense 是 Vue.js（v3.2.0+）中引入的新特性，旨在提高用户体验，使得页面的加载状态更加平滑。与传统的 Loading Component 不同，Suspense 可以直接控制应用程序的状态，而不需要渲染任何 DOM。Vue3 Suspense 是 Vue3 的一个新特性，可以优化和改善异步组件的加载过程。
2024-12-27 20:00:00
862
原创 Vue3 的 Teleport 是什么？在什么场景下会用到？
Teleport 是 Vue3 新增的一个内置组件，它允许开发者将一个组件的模板内容渲染到指定的 DOM 节点中，而不是通常的组件挂载点。
2024-12-20 16:58:10
933
原创 img引入svg如何修改颜色
首先需要一个容纳图标的父盒子(下方实例中的.svg-img)，通过css造一个图标的‘影子’（.svg-color中的drop-shadow），然后设置‘影子’的颜色，再把图标本体移出父盒子，让‘影子’占据本体所在位置，最后后对父盒子设置溢出隐藏达到效果。translateX中的60px和drop-shadow中的-60px必须是一个相同的值，并且最好是大于等于宽高的最大值，这样设置得到的带颜色的阴影图片才会完整无误的在本体图片位置上。
2024-12-14 21:10:31
1941
原创 如何发布及管理npm包
登陆之后就是发布环节，在项目发布之前最好再检查下package.json配置文件，确保name字段没有问题（要发布的包名需要唯一，否则发布将不成功），且version字段是最新的。keywords字段最好认真填写，因为keywords是开发的程序的标签，直接影响到开发的程序被其他程序员检索到的次数，也就是说这是一个和曝光量息息相关的字段。更新版本号又分为手动更新和自动更新，手动更新操作就比较傻瓜一点，直接打开项目的package.json文件手动更新version字段。文件来管理不同的npm注册表账户。
2024-12-06 17:54:11
763
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人