- 博客(166)
- 收藏
- 关注
原创 transform 的使用会影响 offsetLeft
使用transform会影响offsetLeft的计算。offsetLeft返回的是元素相对于其最近的定位祖先元素的左边缘的距离,而transform是在渲染层面上对元素进行变换,不会改变元素的实际布局位置。因此,当使用transform进行平移时,offsetLeft仍然会返回未变换前的位置。
2024-10-31 14:53:11 331
原创 Omit<T, K> 解释
Omit<T, K>是 TypeScript 中的一个内置工具类型,用于从现有类型T中排除(即忽略或移除)指定的属性K,并生成一个新的类型。当你有一个对象类型T并希望创建一个新的类型,该类型与T相同但没有某些特定的属性时,Omit<T, K>就非常有用。KT。
2024-08-09 17:03:27 296
原创 Record<keyof T, T[keyof T]> 解释
是 TypeScript 中的一个高级类型构造,它用于构建一个新的对象类型,其中的键是类型T的所有键的联合类型,值则是这些键对应的值类型。
2024-08-09 16:58:29 412
原创 uniapp中初始化对象不赋值,后续属性无法绑定问题
这是因为在 Vue.js 初始化时,它会对数据对象进行递归遍历,将其所有可枚举的属性转换为 getter/setter 形式的属性,以便能够追踪它们的变化。如果一个属性在初始化时不存在,那么它就不会被转换,也就无法被 Vue.js 的响应式系统追踪。在uni-app中,以及在基于Vue.js的框架中,数据响应式依赖于数据对象的结构。,Vue.js 的响应式系统不会追踪这个空对象内部属性的变化。属性就会被 Vue.js 的响应式系统追踪,当你更新。,这些属性的变化不会被侦测到,从而不会触发视图的更新。
2024-08-02 09:50:28 333
原创 uni-app的onShow 事件意外触发
当你返回到该页面时,框架认为这是一个页面从后台到前台的切换,因此会触发。函数中打印一些日志,查看其被触发的具体条件和上下文,从而更好地理解为何它会被多次触发,并采取相应的措施来避免不必要的操作。的触发可能与微信小程序的生命周期管理有关。在某些情况下,如从一个子页面返回到带有 tabBar 的页面时,可能会出现。此外,根据之前的信息,某些情况下在iOS设备上,尤其是在从一个子页面返回到 tabBar 页面时,:如果页面已经被创建并且处于后台状态(例如,用户浏览了其他页面或应用),当用户再次回到此页面时,
2024-08-02 09:44:22 1022
原创 关于vite 配置路径别名@一些记录
然而,Vite 的配置有一定的灵活性,尤其是在早期版本中,某些配置项可能在主配置对象中直接使用仍然能够被识别。: 你的 IDE 或 TypeScript 类型定义可能没有严格遵循 Vite 的最新规范,因此没有给出警告或错误。: 你可能有自定义的配置或脚本,它们扩展了 Vite 的默认行为,使得非标准配置仍然可以被识别。然而,为了保持代码的健壯性和未来版本的兼容性,建议遵循 Vite 的官方推荐配置方式,将。: Vite 在某些版本中可能仍然支持旧的配置方式,即使这不是推荐的用法。选项的确应当被放置在。
2024-07-23 10:21:22 393
原创 Three.js常见的贴图类型及其用途
每种贴图都有其独特的作用,通过合理组合和使用这些贴图,可以极大地提升3D模型的视觉质量和真实感。这种贴图可以是立方体贴图(Cubemap)或球面环境贴图(Spherical Environment Map),用于捕捉全景环境,使物体表面能够反映出周围环境的细节。位移贴图是最具真实感的贴图类型之一,它实际上会改变模型表面的几何形状,根据贴图中的数据来移动顶点位置,从而创建真实的物理凹凸效果。除了之前提到的贴图类型,Three.js还支持一些其他类型的贴图,用于更高级的视觉效果和物理模拟。
2024-07-16 09:50:03 901 1
原创 js 解构对象时使用了带有横线的变量名
的变量名是合法的,但是在解构对象时如果变量名包含横线,你需要使用对象的属性名来进行解构,而不是变量名。如果你尝试使用带有横线的变量名直接解构,会导致语法错误。在JavaScript中,使用带有横线(这样,你就可以用符合命名规范的。
2024-06-11 17:02:18 354
原创 angular HTTP拦截器阻止请求继续进行并中断请求链
模拟一个HTTP错误响应,从而中断请求流程。这会使得请求不会到达服务器,而且错误可以通过订阅的错误处理逻辑来捕获。在Angular的HTTP拦截器中,如果你希望在特定条件下阻止请求继续进行并中断请求链,直接返回。例如,如果你在拦截器中判断到请求不符合要求,可以通过抛出错误或返回一个带有错误信息的。实际上不会达到预期效果。Angular的HTTP拦截器期望拦截器方法。如果你想要中断请求,应该抛出一个错误或者返回一个错误的。在这个例子中,如果请求不符合你的要求,拦截器会抛出一个。
2024-05-29 16:52:46 552
原创 Angular中,@HostListener装饰器
是事件对象,它包含了关于触发事件的详细信息,比如事件类型、目标元素、事件数据等。装饰器的代码示例,请注意这可能是文档错误、打字错误或者是分享代码时的遗漏,因为在正确的Angular代码中,这是必需的部分。这样的监听器允许你响应用户在输入元素上的交互,并根据需要执行相应的逻辑,比如验证输入、更新组件状态或者触发其他业务逻辑。装饰器必须包含至少一个参数,即要监听的事件名称,它是不可或缺的。是用来监听宿主元素(通常是组件模板内的一个特定元素)上的。类型的实例,你可以通过这个参数访问到事件的相关信息,比如。
2024-05-27 10:09:13 514
原创 TS中constructor使用public 、private 关键字
结论:无论何时在构造函数参数上指定public或private,都会在类上创建相应的公共/私有变量,并使用参数的值填充该变量.关键字时,Angular会自动为你的组件或指令创建一个注入实例,并将其作为构造函数参数的私有属性。两个示例生成的JavaScript将是相同的.但是,如果您尝试访问代码中的私有变量,编译器将抛出错误.:通过这种方式,可以清楚地看到哪个依赖是必要的,以及它是如何在组件或指令中使用的。类型的依赖,并会在编译时检查类型,确保你不会错误地注入其他类型的服务。:Angular知道你需要的是。
2024-05-24 17:24:56 592
原创 angular插值语法与属性绑定
与插值不同,属性绑定可以处理更复杂的数据类型和表达式,并且在属性值需要动态计算或绑定到非字符串类型时更为合适。) 的灵活性体现在它可以处理更复杂的表达式、响应式属性和非字符串类型的数据。综上所述,属性绑定允许你在模板中执行更复杂的逻辑和数据转换,而不只是简单地插入一个值。内部的属性绑定可以动态地改变元素的类列表,而插值语法不能直接与结构指令结合使用。是一个对象,属性绑定可以处理这种情况,而插值语法会要求所有绑定的值都是字符串。是根据用户操作或其他事件动态计算的,属性绑定会确保按钮的。
2024-05-23 16:37:22 466
原创 Angular独立组件模式与传统基于模块
独立组件模式旨在提高开发效率,减少不必要的模块化开销,同时允许更细粒度的代码复用。然而,对于大型复杂应用,传统的 NgModule 模式可能更适合保持代码的组织和可维护性。在Angular中,组件、指令、管道等以前都需要在@NgModule中声明和导出,以便它们能在应用的其他部分被使用。这一变化反映了Angular框架逐渐倾向于使用更简洁的独立组件(Standalone Components)模式,这是一种与传统基于模块(NgModule)体系并行的组件定义方式。这将确保您的新项目中包含传统的。
2024-05-22 15:38:43 1046
原创 在 React Router v5 中,写子路由,父级路由如果加了exact属性,就显示不了子组件
完全匹配当前 URL 时才会被激活。这意味着,如果父级路由精确匹配了,React Router 就不会继续向下查找子路由,因为。,由于父级路由已经精确匹配,React Router 不会继续尝试匹配子路由,因此。在 React Router v5 中,当你在父级路由上使用。如果你希望同时能够访问父级和子级组件,应该移除父级路由上的。属性时,它意味着该路由只有在其。在这个例子中,如果你访问。,因为父级路由设置了。
2024-04-28 16:08:58 742
原创 React Router v5 版本中,路由传参主要方式
每种方式适用于不同场景,动态路由参数适用于路径中固定位置的参数,查询参数适用于可选参数或需要在 URL 中可见的参数,而。后跟参数名的形式,可以捕获特定部分的 URL 路径作为参数传递给目标组件。在目标组件中,可以使用。是一个任意的 JavaScript 对象,它不会出现在 URL 中,但会在路由跳转过程中被保存在。综上所述,在 React Router v5 中,您可以使用动态路由参数、URL 查询参数或。适用于不需要在 URL 中显示的私密或复杂数据。在目标组件中,可以使用。在目标组件中,可以通过。
2024-04-26 17:20:20 718
转载 react-router(V6)配置路由的两种方式BrowseRouter组件式和createBrowseRouter函数式
1.createBrowseRouter()函数、createRoutesFromElements()函数、RouterProvider组件、Route组件搭配使用。方式二:函数式(更受人喜爱的方式!,官网原话:https://reactrouter.com/en/main/start/tutorial#jsx-routes)背景:前端项目都离不开前端路由,react-router第三方库为我们提供了配置前端路由的统一解决方案,其中就有两种方式。
2024-04-25 09:55:11 608
原创 运用useRef实现数据存储
在React中,useRef用于创建一个可变的、持久化的引用对象,这个对象可以在组件的整个生命周期内保持其.current属性的值不变,即使组件重新渲染。因此,useRef常被用来在组件间跨渲染周期存储任意数据。以下是关于如何使用useRef。
2024-04-15 17:00:59 456
原创 ts中高阶类型的理解
时,TypeScript 会生成一个表示对象所有可能键的类型,这对于编写更灵活且类型安全的代码非常有用,尤其是在处理映射、枚举对象属性或创建基于现有类型的接口和函数参数时。这个类型主要用于检查和限制变量必须是给定对象类型的所有可能键名之一,确保在代码中使用的属性名是有效的、与类型。此处的 `extends` 用于在条件类型表达式中进行类型检查,如果 `T` 扩展自数组类型,则推断并返回数组元素类型 `U`,否则返回 `T` 类型本身。如果我们想创建一个新的类型,其中所有的属性都是可选的,可以使用。
2024-03-12 16:54:42 1023
原创 鸿蒙os开发做全局路由拦截
请注意,以上示例代码基于假设和类比其他前端框架的路由拦截原理,具体实现可能需要参考鸿蒙OS最新的官方文档和SDK说明来定制符合实际需求的解决方案。: 如果框架不支持直接的全局路由拦截器,可以考虑在所有页面跳转路径上的一个公共父组件或通过事件总线(EventBus)与服务通信的方式实现拦截。在进入每个页面前,由这个中间层组件或服务来决定是否允许继续跳转。: 对于涉及系统权限级别的拦截,应遵循HarmonyOS的安全规范和API设计,结合系统提供的权限管理机制,在用户授权之前阻止访问某些特定页面。
2024-03-06 09:51:52 1481
原创 解决使用node版本管理工具 NVM 出现的问题(找不到 node,或者找不到 npm)
3.安装后执行 nvm use 【版本】 当node文件夹正常生成即可。1.首先确保删除了之前下载的node。2.通过NVM安装指定版本的node。
2023-11-20 11:41:15 1493
转载 vite vue-router history模式打包部署
总结一下history模式部署时需要改动的地方如果是部署在根目录下,只需要改nginx配置如下即可,前端配置无需修改如果是部署在二级目录下(如部署在/wj目录),修改内容如下nginx配置# nginx 修改后配置vue-router配置})配置// 其他代码省略。
2023-09-19 15:25:00 1841
转载 Node快速切换版本、版本回退(降级)、版本更新(升级)--Windows
【代码】Node快速切换版本、版本回退(降级)、版本更新(升级)--Windows。
2023-09-06 10:36:23 2003
转载 this为什么会为undefined?
运行环境’也是对象,this指向运行时所在的对象。如果一个函数在全局环境运行,this就指向顶层对象(浏览器中为window对象);如果一个函数作为某个对象的方法运行,this就指向那个对象;如果一个函数作为构造函数,this指向它的实例对象。
2023-07-18 14:15:45 1116
原创 uni-app App权限配置参数详情
android.permission.ACCESS_LOCATION_EXTRA_COMMANDS 访问定位额外命令 允许程序访问额外的定位提供者指令。
2023-06-08 15:32:58 2806
转载 uniapp 代理proxy配置方法
上述配置中,我们将所有以/api开头的请求都代理到http://example.com上。其中,target属性表示代理的目标地址,changeOrigin属性表示是否改变请求头中的Origin字段,如果设置为true,则会将Origin字段设置为代理的目标地址。由于我们已经在vue.config.js中配置了代理,请求会被代理到http://example.com/api/users上。上述配置中,我们使用了正则表达式来匹配请求路径,并将/api替换为/example/api。
2023-06-01 10:53:51 3398
转载 js中的函数
但是,一旦第n个位置的形参、实参、arguments都存在时,形参将于arguments绑定,同步变化,(即,在函数中修改形参的值,arguments也会改变。>>>当调用函数,并且实参赋值时,实际上参数列表已经保存到arguments数组中,可以在函数中,使用arguments[n]的形式调用。递:将函数执行上半部分,遇到自身的调用语句时,继续进入内层函数,再执行上半部分。注意:使用匿名函数表达式时,函数的调用语句,必须放在函数声明语句之后!函数的形参列表,默认为函数的局部变量,只能在函数的内部使用。
2023-04-20 14:27:13 293 1
转载 动态引入DynamicImport实现原理
本文介绍的动态引入实现方式基于 rollup 插件通常情况下,我们都是通过确定的字面量路径来引用文件模块的,例如:123import'./a.js';require('./a.js'import('./a.js'对于确定的文件路径来说,构建工具可以轻易的抓取文件并进行相关的转换。但当import或者require的目标不是一个静态字符串,而是一个动态表达式时,构建工具其实也不确定用户到底引用了什么,所以通常这种情况只能依靠 JavaScript 的运行时来解析。
2023-01-13 14:51:42 2754
原创 格式化get请求路由参数
changeParam(param) { let url = '?'; for (let key in param) { if (param[key] !== undefined) { url += `${key}=${encodeURIComponent(param[key]) === 'null' ? "" : encodeURIComponent(param[key])}&` } } url = url.substri..
2022-11-30 11:38:04 523
转载 Vite 的打包和预览功能
而在打包成功后,我们通常需要在浏览器中测试一下打包出来的东西有没有问题,那么一种方法是通过。而在开发完成后,我们需要将项目代码打包到指定的输出文件夹(比如。)中,之后再到服务器中部署打包出来的这个文件夹。而如果是在打包之后,想要预览打包出来的代码的效果,那就执行。之后,如果是在开发阶段想要把项目跑起来,那就直接执行。这个预览的效果也就是我们打包出来的效果。当然,在真实开发中,我们一般不会一直敲。打包成功后,会在项目目录下生成一个。会默认把我们的代码打包进。文件中会存放第三方的资源。的打包和预览功能的说明。
2022-09-09 12:10:03 8971 4
原创 uniapp小程序props传值,对象方法丢失
如果包含function属性则会被忽略掉 主要原因 uniapp props实现采用了JSON.parse(JSON.stringify(ret)),导致this中的data中会识别到对象如果包含function,会直接丢失到该属性。
2022-09-01 13:50:37 1896
转载 renderjs有什么用?聊聊uniapp中用renderjs的一些细节
3.1在renderjs中使用better-scroll做过app-vue开发的话应该知道在service层中没有document对象,无法获取dom节点。所以引用一些外部js的时候,如果初始化的时候需要传入一个选择器的,那基本就断定用到了document对象获取节点。这时候就需要用到renderjs了,首先看一个的示例。根据官方给出的示例做一些修改,我们可以得到以下代码3.2better-scroll自定义id重点来了,上面的例子中虽然实现了效果,但是也出现了一个问题id是固定的。。...
2022-07-29 11:55:07 5004 2
转载 VUE3 中的 Watch 详解
一、监听基础类型二、监听复杂类型复杂类型的监听有很多种情况,具体的内容如下其第一个参数是直接传入要监听的对象。当监听整个对象时,只要这个对象有任何修改,那么就会触发 watch 方法。无论是其子属性变更(如 demo.name),还是孙属性变更(如 demo.soulmate.name)...,都是会触发 watch 方法的。2. 监听对象中的某个属性如上代码,监听 demo 对象的 name 属性,那么只有当 demo 对象的 name 属性发生变更时,才会触发 watch 方法,
2022-07-13 11:04:51 29153 5
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人