- 博客(708)
- 收藏
- 关注
RSS订阅原创 微信小程序--关于js文件在Page({})外部声明的变量
在onLoad函数里让test++，并console.log(test)页面，一般包含4个文件。中未被销毁，则当再次加载此页面时，变量的值不会改变。重新初始化，则可以在生命周期函数–监听页面卸载的。时，当用户退出该页面时，只要该页面还驻留在。因此在这种情况中，要想在重新加载页面时对。test已经被reassigned.在Page({})声明变量test。在test.js文件中，当用户。函数里对这些变量重新赋值。
2025-08-01 15:05:52
171
原创 CSS Flex 布局如何设置元素间距
gap 属性是用来设置网格行与列之间的间隙，该属性是row-gap and column-gap的简写形式。CSS 网格布局起初是用 grid-gap 属性来定义的，目前逐渐被 gap 替代。默认值:继承:no版本:CSS3object。
2025-07-31 18:08:24
169
原创 《Vuejs设计与实现》第 12 章（组件实现原理 下）
在这里，我们为渲染上下文的代理对象 get 方法添加了一个特殊的处理：如果读取的属性是 slots，那么我们直接返回组件实例上的slots对象，这样用户就可以通过this.slots，那么我们直接返回组件实例上的slots对象，这样用户就可以通过this.slots 来访问插槽内容了。在执行组件的 setup 函数前，我们先设置 currentInstance 为当前组件实例，这样就能关联起通过 onMounted 函数注册的钩子函数与当前组件实例。此外，我们讨论了组件的 props 和被动更新。
2025-07-30 23:37:37
727
原创 为什么vue3计算属性get数组与对象，当改变时，无法执行set？
前些天，之前的同事问我，他在用vue3 v-model绑定对象时，在子组件中改变对象的属性值不会触发set函数，但是在vue2中是可行的，问我咋回事。来实现的，他是对整个对象进行代理，我们在改变对象属性时，实际上是对这个代理对象的set操作，而computed的set 函数触发是需要对整个对象重新赋值才能触发的，就比如上面的button事件，将属性赋值成一个新的对象，才会触发computed的set 函数。在最佳实践中，你应该尽可能避免这样的更改，除非父子组件在设计上本来就需要紧密耦合。
2025-07-28 22:45:17
345
原创 vue如何在data里使用this
在Vue中要在data里使用this，有以下几种方法：使用箭头函数、在created生命周期钩子中设置data、使用Vue 3的Composition API。这些方法都能有效地解决在data中使用this的问题。进一步建议：熟悉Vue生命周期钩子：了解Vue组件的生命周期钩子函数，有助于在适当的时机执行相关逻辑。学习Composition API：如果你使用的是Vue 3，建议学习并使用Composition API，它提供了更灵活的状态管理方式。代码复用。
2025-07-28 22:14:41
579
1
原创 扩展组件（uni-ui）之uni-group
uni-group是uni-ui组件库中的分组容器组件，用于组织相关内容。基本用法需先引入组件，通过title属性设置分组标题，可包含文本、列表等任意内容。使用时需注意：1)适用于表单、设置等逻辑分组；2)需修改CSS解决下拉组件隐藏问题（.uni-group--card{overflow:visible!important}）；3)标题有助于用户快速理解内容主题。详情可参考uni-ui官方文档。
2025-07-27 21:21:43
277
原创 如何在 uni-forms 中绕过校验获取表单数据？
通过提取并还原uni-forms的内部表单结构，我们可以在不触发任何校验的情况下灵活获取数据。objSet是这个能力的核心实现，它解决了“根据路径动态构建嵌套对象”的复杂问题，是一个非常实用的工具函数。表单不应总是被动地受控于“校验通过才有值”的逻辑，有时候我们需要更多主动权 —— 而这就是的意义所在。reduce()
2025-07-27 14:31:54
833
原创 uni-file-picker vue3二次封装（本地上传 + v-model）
该图片上传组件提供了完整的文件处理解决方案：通过3实现文件选择严格的格式和大小验证智能的图片压缩策略灵活的上传配置（地址/字段/请求头）完善的状态管理和错误处理组件设计考虑了移动端用户体验，包括：友好的提示信息加载状态反馈直观的操作流程美观的视觉设计开发者可根据实际需求调整验证规则、压缩算法和UI样式，以适应不同项目需求。
2025-07-24 17:05:25
1184
原创 为何在 Vue 的 v-model 指令中不能使用可选链（Optional Chaining）？
虽然可选链在 JavaScript 中极大提升了代码的安全性，但在 Vue 的响应式绑定中，尤其是v-model这种需要赋值能力的场景下，它的局限性就显现出来了。
2025-07-22 21:27:43
752
原创 关于uni-app中uni-forms表单验证时“多级结构对象数据”如何做数据校验的解决方案
这几天在做uni-app表单验证时遇到了一个问题，按官方文档给出的方法，当需要数据校验时，只需要1.为uni-forms中的"modelValue"数据设置“:rules”对应2.“”的name和“”中“v-model”中的key和“rules”中的key相同就可以对该项“uni-easyinput”做数据校验了。这一步很多人看官方文档就能够写好，并没有其他问题。
2025-07-22 21:21:57
200
原创 Vue (Official) v3.0.2 新特性 为非类npm环境引入 globalTypesPath 选项
在早上更新了vscode后，发现自己 uni-app 项目的.vue文件的template标签都出现了报错。定位到了问题是因为插件更新导致的，重装了插件的上一个小版本，报错消失，暂时解决了问题。这个错误提示是 Vue (Official) 有意设计的功能，而不是一个bug。他解决了先前在检测不到时，写入全局类型会造成大量内存开销的问题。类似 npm 会生成结构的项目都不需要关心这个问题。而像 uni-app 这样的项目在使用时则需要进行配置。如果项目包含文件夹，出现了同样的报错，推荐查看#5516。
2025-07-18 21:49:34
814
原创 Monorepo + vite 怎么热更新
有时候默认的依赖启发式算法（discovery heuristics）可能并不总是理想的。如果您想要明确地包含或排除依赖项，可以使用optimizeDeps 配置项来进行设置。或的一个典型使用场景，是当 Vite 在源码中无法直接发现 import 的时候。例如，import 可能是插件转换的结果。这意味着 Vite 无法在初始扫描时发现 import —— 只能在文件被浏览器请求并转换后才能发现。这将导致服务器在启动后立即重新打包。include和exclude都可以用来处理这个问题。
2025-07-18 16:33:02
1150
原创 vue-cli 模式下安装 uni-ui
注意与web开发不同，uni-ui不包括基础组件，它是基础组件的补充。web开发中有的开发者习惯用一个ui库完成所有开发，但在uni-app体系中，推荐开发者首先使用性能更高的基础组件，然后按需引入必要的扩展组件。使用 npm 安装的组件，默认情况下 babel-loader 会忽略所有 node_modules 中的文件 ，导致条件编译失效，需要通过配置。项目模板，只需在页面中敲u，拉出大量组件代码块，直接选择，即可使用。下的组件的，导致条件编译等功能失效 ，导致组件异常 需要在根目录创建。
2025-07-17 18:19:39
1026
原创 exports使用 package.json字段控制如何访问你的 npm 包
这种方法虽然简单，但存在局限性：它只允许一个入口点，并且包中的所有文件都可访问，无法保护内部文件。随着生态系统的发展（尤其是 ESM 的兴起和对多格式包的需求），这种方法很快就显得力不从心。术语ECMAScript 模块（ESM）：JavaScript 使用原生。
2025-07-16 22:22:46
1138
原创 monorepo 发布库 --- 发布
这意味着当你运行 publish-packages 时，你的 monorepo 会被构建、linted、测试和发布 - 并且你将受益于 Turborepo 的所有加速功能。我们推荐 Changesets，因为它使用直观，并且 - 就像 Turborepo 一样 - 符合你已经习惯的 monorepo 工具。如果你的包是公开的，请将 Changeset 的 access 设置为 public。，选择本次需要升级的包列表，分别选择不同版本类型对应的包，信息，并点击两次回车，执行完成后，将在项目的。
2025-07-13 10:56:39
964
原创 monorepo 发布库 --- 打包文件
使用合适的工具，从 monorepo 发布包到 npm 注册表可以是一个顺畅的体验。虽然本指南无法解决稳健包所需的所有可能的编译、打包和发布配置，但它将解释一些基础知识。如果你想将 monorepo 的一些包发布到 npm，你应该遵循此设置。如果你不需要发布到 npm，你应该使用内部代替。它们更容易设置和使用。
2025-07-12 23:55:32
1087
原创 pnpm 的 resolution-mode 配置 ( pnpm 的版本解析)
pnpm 有一个名为 resolution-mode 的配置项（在.npmrc文件中配置），但无论是 resolution-mode 这个名字还是配置项的值的名字，都相当的不直观，更不方便记忆。
2025-07-11 21:51:33
323
原创 tailwindCSS === 使用插件自动类名排序
我们认为，在保持主观性和在自定义方面提供较少选择时，Prettier 做对了——归根结底，对您的类进行排序的最大好处是，您可以减少一件与团队争论的事情。我们非常努力地提出了一个易于理解且能尽快传达最重要信息的排序顺序。该插件将尊重您的 tailwind.config.js 文件，并与您安装的任何 Tailwind 插件一起工作，但是无法更改排序顺序。就像 Prettier 一样，我们认为自动格式化的好处将很快超过您拥有的任何样式偏好，并且您会很快习惯它。然而，该停下来的时候到了。
2025-07-11 21:38:50
762
原创 vite配置之获取.env.[mode]下的数据
文件，并定义了一个VITE_BASE_URL字段，用于跟不同的服务对接的时候不同的请求前缀。 Vite 使用 dotenv 从你的 环境目录 中的下列文件加载额外的环境变量： 。文件的，因为这些文件需要在执行完 Vite 配置后才能确定加载哪一个，举个例子，如果我们的项目上线的环境比较多，或者再开发对接的时候要配置不同的环境，如。默认运行生产模式构建，你也可以通过使用不同的模式和对应的。但是实际的开发当中，我们还需要增加一些自定义的字段，如。时运行不同的模式来渲染不同的标题，你可以通过传递。
2025-07-10 23:07:26
817
原创 tailwind （ uni ） === 自定义主题
主题变量是使用@theme指令定义的特殊 CSS 变量，会影响项目中存在哪些工具类。例如，你可以通过定义主题变量（如@theme {现在你可以在 HTML 中使用工具类，如或-- ... --></div>-- ... --></div>主题变量不仅仅是 CSS 变量 - 它们还指示 Tailwind 创建可在 HTML 中使用的新工具类。由于它们比常规 CSS 变量功能更多，Tailwind 使用特殊语法，因此定义主题变量始终是明确的。
2025-07-09 23:51:39
1082
原创 monorepo + Turborepo -- 环境文件
环境变量输入是您应用程序的重要组成部分，您需要在 Turborepo 配置中考虑它们。在 Turborepo 中使用环境变量时，有三个重要问题如果在您的配置中未能考虑环境变量，可能会导致您的应用程序以错误的配置发布。这可能会导致严重的问题，例如将您的预览部署发布到生产环境。须知： Turborepo 还使用 系统环境变量 来配置其自身的行为。在下面，您将找到有关任务运行时的环境变量以及它们如何影响任务哈希的信息。
2025-07-07 14:48:10
968
原创 monorepo + Turborepo --- 开发应用程序
在 Monorepo 中开发应用程序可以解锁强大的工作流程，使你能够进行原子提交到源代码控制，并轻松访问代码。大多数开发任务都是长时间运行的任务，它们会监视代码的更改。Turborepo 通过强大的终端 UI 和其他功能（例如）增强了这种体验。
2025-07-06 22:30:27
692
原创 monorepo + Turborepo 缓存
Turborepo 有一个 --summarize 标志，可用于获取任务的所有输入、输出等的概述。比较两个摘要将显示为什么两个任务的哈希不同。这对于以下方面非常有用。
2025-07-05 00:25:50
1088
原创 monorepo + Turborepo --- 运行任务
在 run 子命令的文档 中，你将找到许多有用的标志，可以根据你的需要定制 turbo run 的行为。当运行全局 turbo 时，你可以使用如下工作流程更快地运行：你最常用命令的变体：package.json 中的 build 脚本在它是 turbo build 时最有用 - 但你可能目前只对特定包感兴趣。你可以使用快速筛选出你感兴趣的特定包。一次性命令：像 turbo build --dry 这样的命令不常用，因此你可能不会在你的 package.json 中为其创建脚本。
2025-07-04 23:41:50
1072
原创 monorepo + Turborepo --- 配置任务
tasks 对象中的每个键都是可以通过 turbo run 执行的任务。Turborepo 将在你的包中搜索 package.json 中脚本名称与任务名称相同的脚本。tasks 对象中的每个键都是一个任务的名称，可以通过 turbo run 执行。Turborepo 将在你的 Workspace 配置 中描述的包中搜索 package.json 中具有任务名称的脚本。使用任务中描述的其余配置，Turborepo 将按描述的顺序运行脚本，并在提供时将日志和文件输出缓存在 outputs 键 中。
2025-07-04 17:15:50
638
原创 monorepo + Turborepo --- 创建内部包
让我们按照 包的解剖结构 部分和 编译包 模式中的指导，创建你的第一个内部包，以在你的仓库中共享数学实用程序。Turborepo 使用 package.json 中的依赖关系自动理解内部包之间的关系，在底层创建一个 包图，以优化你仓库的工作流程。因为你对从注册中心下载包的消费者将如何使用你的包一无所知，所以由于健壮包所需的众多配置，你可能会发现它很困难。这不是严格的科学或规则，而是一个最佳实践，取决于你的仓库、你的规模、你的组织、你的团队的需求等等。相反，它们应该被视为你的 包图 的入口点。
2025-07-03 18:31:25
743
原创 monorepo + Turborepo --- 管理依赖项
外部依赖项来自npm 注册表，使你能够利用生态系统中的有价值代码，更快地构建应用程序和库。内部依赖项让你在仓库内共享功能，极大地提高了共享代码的可发现性和可用性。我们将在下一个指南中讨论如何构建内部包。
2025-07-03 17:34:14
794
原创 unipp（h5）兼容低版本浏览器es5
部署 | Vitesse uni-app@dcloudio/vite-plugin-uni 中的 viteLegacyOptions 也 只会在 H5 中 生效，此时只可以使用 core-js 来手动注入。可以参考上面的地址 作者只尝试了h5。
2025-07-03 16:56:58
796
原创 解决 Pinia 持久化插件在 Vite 中的依赖解析问题
pinia-plugin-persistedstate 插件的依赖解析问题主要源于包管理器的不同行为。通过调整配置或显式安装依赖，可以轻松解决这个问题。理解不同工具链的工作原理有助于开发者更高效地解决类似问题。
2025-07-03 15:46:26
289
原创 monorepo + Turborepo --- 构建仓库结构
如果您发现自己编写 ../ 以从一个包转到另一个包，您可能有一个机会通过在需要它的地方安装包并将其导入到您的代码中来重新考虑您的方法。首先，您的包管理器需要描述您的包的位置。IDE 自动完成：通过使用 exports 指定包的入口点，您可以确保您的代码编辑器可以为包的导出提供自动完成功能。此外，包还具有特定的入口点，工作区中的其他包可以使用这些入口点来访问该包，这些入口点由exports 指定。在包的目录中，必须有一个 package.json，以使包可被您的包管理器和 turbo 发现。
2025-07-02 22:09:33
1374
原创 在移动端使用 Tailwind CSS （uniapp）
中，所采集的类名，以及生成的结果，转化成小程序中可以接受的方式。从本质上讲，它是一个字符串转义器。你可以很容易在各个框架，或原生开发中集成。微信开发者工具导入这个项目，即可看到效果。由于小程序运行时，本身有自己的一套。就能让你，在小程序开发中使用。的主流多端小程序框架和使用。生成器来提升你的开发效率。然后把下列脚本，添加进你的。现在，就让我们开始使用吧！单位的补丁，否则它会把。的原生小程序打包方式。开发中的很多的特性，它支持目前上所有使用。
2025-07-02 15:36:52
591
原创 UniApp（vue3+vite）如何原生引入TailwindCSS（4）
可以安装插件提示 Tailwind CSS IntelliSense附上作者生效的环境官网地址如果采用v3.4.17请翻阅其他文档！！！},},
2025-07-02 13:43:22
1460
1
原创 js === insertBefore() 方法
<title>菜鸟教程(runoob.com)</title>单击按钮插入一个项目列表</p><button onclick="myFunction()">点我</button><script></script><p><strong>注意:</strong><br>首先创建一个li节点,<br>然后创建一个文本节点,<br>然后添加文本节点的在li节点。<br>最后在第一个子节点列表插入li节点。
2025-06-29 23:21:47
347
原创 《Vuejs设计与实现》第 12 章（组件实现原理 上）
在上一章节，我们详细探讨了渲染器的基本概念和实现方式，它的主要作用是将虚拟 DOM 渲染为真实 DOM。然而，当我们处理复杂页面时，虚拟 DOM 描述页面结构的代码量可能会剧增，导致页面模板臃肿。为此，我们引入了组件化的概念，通过组件，我们可以将大型页面划分为多个模块，每个模块都独立为一个组件，最终组成完整的页面。本章将详细介绍 Vue.js 中的组件化实现。
2025-06-27 18:22:27
616
原创 微信小程序 / UNIAPP --- 阻止小程序返回（顶部导航栏返回、左 / 右滑手势、安卓物理返回键和调用 navigateBack 接口）
在页面上引入这个组件后，若show值为true，页面上所有各种方式触发的返回操作都会被这个组件所拦截，然后自动将值置为false。所以要达到不点击确定返回，下一次做返回操作时依旧要阻止，就可以在每次返回点取消时候，移除page-container，再重新生成一个page-container，这时就又会重新通知小程序监听返回一次，所以上文用的是v-if。下面这个简单理解希望可以帮助到大家。当用户做了返回操作后，小程序执行了阻止返回，然后移除了监听，所以接着再做一次返回操作就直接返回了。
2025-06-25 22:01:43
1142
1
原创 《Vuejs设计与实现》第 11 章（快速 diff 算法
快速 Diff 算法在实测中性能最优。它借鉴了文本 Diff 中的预处理思路，先处理新旧两组子节点中相同的前置节点和相同的后置节点。当前置节点和后置节点全部处理完毕后，如果无法简单地通过挂载新节点或者卸载已经不存在的节点来完成更新，则需要根据节点的索引关系，构造出一个最长递增子序列。最长递增子序列所指向的节点即为不需要移动的节点。
2025-06-24 11:14:45
795
原创 《Vuejs设计与实现》第 10 章（双端 diff 算法）
10.1 双端比较的原理简单 Diff 算法的问题在于，它对 DOM 的移动操作并不是最优的，我们举个例子：上图如果使用简单 Diff，则会发生两次 DOM 移动操作：上述两次移动操作，其实只需要把真实 DOM 节点 p-3 移动到真实 DOM 节点 p-1 之前这一次操作即可：上述操作，我们可以通过双端 Diff 算法实现。双端 Diff 算法是同时进行两组子节点的头尾比较的一种算法。首先，我们需要设定四个索引，分别指向新旧子节点的两端：我们在和在。
2025-06-23 11:14:20
581
原创 小程序请求加载提示防闪烁机制详解
状态聚合：通过计数器合并请求状态延迟响应：100ms缓冲期观察后续请求操作可中断保证只响应最终状态临界值保护防止负数防抖思想应用：这种模式本质是前端防抖(debounce)技术的变种，将高频的状态变更合并为单次稳定操作。100ms延迟经过实践验证，在用户体验和响应速度间达到最佳平衡。
2025-06-17 18:22:17
505
微信公众号的网页授权域名已经支持配置多个方案
2025-04-30
前端 自动部署 前端web自动化部署到服务器脚本 解放双手
2025-04-30
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人