- 博客(123)
- 收藏
- 关注
原创 [React]基础知识
(1)受控组件在使用表单来收集用户输入时,例如等元素都要绑定一个change事件,当表单的状态发生变化,就会触发onChange事件,更新组件的state。这种组件在React中被称为受控组件,在受控组件中,组件渲染出的状态与它的value或checked属性相对应,react通过这种方式消除了组件的局部状态,使整个状态可控。react官方推荐使用受控表单组件。受控组件更新state的流程:● 可以通过初始state中设置表单的默认值● 每当表单的值发生变化时,调用onChange事件处理器。
2025-10-22 14:40:20
698
原创 [css]基础知识和常见应用
以 iPhone XS 为例,当写 CSS 代码时,针对于单位 px,其宽度为 414px & 896px,也就是说当赋予一个 DIV元素宽度为 414px,这个 DIV 就会填满手机的宽度;而如果有一把尺子来实际测量这部手机的物理像素,实际为 1242*2688 物理像素;经过计算可知,1242/414=3,也就是说,在单边上,一个逻辑像素=3个物理像素,就说这个屏幕的像素密度为 3,也就是常说的 3 倍屏。对于图片来说,为了保证其不失真,1 个图片像素至少要对应一个物理像素,假如原始图片是 500。
2025-10-13 15:58:57
337
原创 [JS]面试八股文
答:闭包(Closure)是指“一个函数及其词法环境(即该函数被定义时的作用域)的组合”。简单来说,闭包让一个函数可以访问其外部作用域中的变量,即使在外部函数执行完毕后,这些变量依然可以被内部函数访问和操作在调用一个函数A时返回了一个函数B,并在B中访问了A中的变量,就会形成一个闭包,在A的执行上下文中会保存一个closure(A)的对象,并将B中访问的变量保存在堆中。闭包其实只是一个绑定了执行环境的函数。
2025-10-10 19:31:00
601
原创 [React]监听Form中某个字段的变化
有这样一个需求,整个组件是一个表单,在表单中,如果某一个字段的值发生了变化,那需要根据逻辑关系渲染不同的表单项。
2025-09-01 17:05:59
629
原创 [React]Antd Select组件输入搜索时调用接口
由于接口返回较多,需要在Select组件中输入时进行调用接口并搜索,而不是初始化时把全部写入Option。
2025-08-25 18:59:08
269
原创 [React]Antd Cascader组件地区选择
新增时通过pid依次获取下一级菜单回显时通过递归获取菜单后端还是要好好设计一下,这太麻烦了~
2025-08-25 16:36:31
486
原创 垂直元素均匀分布
实现垂直元素的均匀分布,如果只有一个元素则在最上方。/* 可选:在子元素之间添加固定间距 *//* 可选:在子元素之间添加间距 *//* 每个子元素平摊可用空间 */主要使用flex:1使空间均分。
2025-07-31 16:29:27
207
原创 [echarts]多个柱状图及图例
本文介绍了在React中使用ECharts实现多柱状图功能的方法。通过echarts.init初始化图表,配置了包含四个状态的图例样式,设置了不同的颜色和渐变效果。文章详细说明了x轴和y轴的样式配置,包括文字大小、换行处理、轴线样式等,以及柱状图的圆角、渐变颜色和间隔设置。同时提供了定时刷新数据的实现思路,通过调用DeviceApi获取数据并更新图表。代码展示了完整的ECharts配置选项,可作为React项目中实现动态柱状图组件的参考。
2025-07-31 15:16:41
287
原创 [echarts]横向柱状图
本文介绍了使用React和Echarts实现横向排序柱状图的方法。通过配置双Y轴实现数据标签在柱状末端展示的效果,利用富文本样式为Top1-3设置特殊样式。关键点包括:使用useRef获取DOM引用初始化图表、配置grid控制图形区域大小、设置x/y轴的样式和交互效果、通过series.realtimeSort实现数据排序展示。代码片段展示了完整的Echarts配置选项,包括图例、坐标轴、数据系列等核心参数设置,适用于需要动态刷新排序数据的可视化场景。
2025-07-31 15:03:57
321
原创 [css]旋转流光效果
添加上述代码之后,可以获得一个线性旋转,旋转一整周(1turn)并周期循环的动画。遮挡后即可看到绕边框一周的旋转流光效果。实现一个矩形的旋转流光边框效果。改变旋转点还可以获得平移流光效果。,他指的是圆锥形变化的梯度。
2025-07-29 18:09:33
387
原创 Express实现定时任务
本文介绍了如何使用node-schedule库实现定时任务调度系统。首先安装node-schedule库,然后创建调度器模块,包含Scheduler主类和TaskScheduler任务类。Scheduler类管理多个任务,提供统一启停接口;TaskScheduler类封装单个任务,通过cron表达式控制执行时间。最后在Express服务器启动时激活调度器。该系统实现了每周一8点执行CI数据和Jira数据获取任务的定时调度功能,代码结构清晰,易于扩展和维护。
2025-07-11 20:31:59
204
原创 使用node调用jira接口
摘要:本文介绍如何使用Node.js通过Jira API获取过滤后的Jira数据。主要步骤包括:1)安装jira-client库;2)配置Jira连接参数;3)通过JQL查询语句获取指定时间范围内的issue数据;4)处理返回数据并存储到数据库。代码示例展示了如何获取上周/最近30天的issue,以及如何将数据保存或更新到数据库中。需要注意的是,获取的数据范围取决于账户权限。该方法适用于需要定期同步Jira数据的自动化场景。
2025-07-11 20:25:52
266
原创 [electron]升级功能
本文介绍了Electron应用实现自动更新功能的完整方案。首先需要配置Amazon S3存储服务器,设置Bucket Policy并修改electron-builder配置以生成last.yml版本文件。在主进程中使用electron-updater模块,注册更新事件监听,包括版本检查、下载进度和安装完成等状态。渲染进程通过React组件展示更新弹窗,显示版本信息、更新日志及下载进度,并提供下载和安装按钮。系统通过IPC通信实现主进程与渲染进程的交互,当检测到新版本时,用户可手动触发下载和安装流程。该方案实
2025-07-11 20:01:14
386
原创 python打包成exe之后,引用文件路径问题
当Python脚本需要读取同级目录下的文件时,使用__file__获取路径在直接运行时正常,但打包成exe后会失效。这是因为打包后__file__指向临时解压路径。解决方案是检测运行环境:通过sys.frozen判断是否打包,打包时使用sys.executable获取真实路径,否则使用__file__。具体实现可通过一个resource_path()函数进行环境判断并返回正确路径,确保脚本在两种运行方式下都能正确定位资源文件。
2025-06-19 17:14:23
527
原创 [Spring Boot]整合Java Mail实现Outlook发送邮件
本文详细介绍了如何通过JavaMail实现Outlook邮件的发送。首先,讲解了如何开启Outlook账号的SMTP服务,包括个人邮箱和商用账号的不同操作步骤。接着,介绍了如何在项目中添加JavaMail依赖,并配置邮件发送的相关参数,如用户名、密码、主机和端口等。
2025-05-19 17:20:04
1286
原创 [Spring Boot]Controller、Service、Mapper、Model的关系
在Spring Boot项目中,应用程序通常分为四个层次:Controller层、Service层、Mapper层和Model层。
2025-05-19 14:20:50
423
原创 exec和spawn
需求:做一个electron应用,用node打开exe软件,打开后返回成功与否,打开的软件不会随electron应用的关闭而关闭。
2025-04-25 20:28:06
651
原创 [Vue3]绑定props 默认值
/ 组件List.vue// 定义 Props 类型和接口content: {}[];// 使用 defineProps 定义 PropslistData?// listData 属性为可选的 ListItem 数组类型}>();
2025-04-22 17:06:54
991
原创 [TS]引入.ts文件报错:An import path can only end with a ‘.ts‘ extension when ‘allowImportingTsExtensions‘
在使用VSCode编辑器进行TypeScript编程时,我们经常会使用import语句导入其他的模块。然而,在某些情况下,我们可能会遇到以下错误提示:An import path can only end with a ‘.ts’ extension when ‘allowImportingTsExtensions’ is eabled。这是由于在TypeScript中,import语句引用的是模块的名称而不是具体的文件路径,因此在引用模块时不应该使用文件的扩展名。
2025-04-22 15:13:31
937
原创 [TS]组织ts中的类型
项目中会有很多类型声明,有时A开发一个模块时,声明了 TypeA,B声明 TypeB,这两个类型非常相似,但由于A不知道B也声明了类似的类型,导致重复声明。类型文件的存放的位置也可能不一样,日积月累,项目中的类型文件越来越混乱。
2025-04-22 14:06:15
252
原创 [Vue3]动态引入图片
需要动态引入background-image,如果在css中静态写入的话没有问题,但是使用变量动态引入,由于vite打包后,无法找到路径。
2025-04-18 20:19:14
752
原创 [electron]自动注册IPC的解决方案
主进程和渲染进程通过IPC进行通信,每次需要定义名称并注册,很多代码都是重复书写,并且如果主进程和渲染进程开发人员是同一个的话,很多东西都可以简化。渲染进程通过ipcRenderer.invoke与主进程通信,主进程通过ipcMain.handle接受渲染进程传递的参数并返回调用结果,二者用一个key进行对应,希望此过程可以简化,省略key的书写,进行自动注册。
2025-04-10 10:45:26
639
原创 [vue]diff算法
Vue是基于依赖收集完成的响应式,当一个节点发生改变时,它相关的节点都会被更新。如果对所有的组件都进行更新,那么对性能的影响是很大的,如果可以找出其中不需要更新的地方,只更新需要更改的部分,那么性能也会得到较大的提升,这就是diff算法存在的必要性。通过新旧 vnode 比对,从而找到实际需要更新的结点,再进行更新,这个过程称为 patch。
2024-12-09 16:07:49
1173
原创 [Vue3]computed原理
总结来说,computed在第一次get的时候在内部收集了依赖,并将内部缓存开关设为了false,此后只有在依赖改变的时候,才会将内部缓存开关设为true,从而使computed的值发生改变。
2024-12-05 15:58:12
1154
原创 [Vue3]简易版Vue
ref功能主要是收集依赖和触发依赖的过程。实现reactive功能reactive主要是让对象也可以进行依赖的收集,这就需要为对象的每一个key创建对应的Dep。简易版Vue雏形使用上面的reactive和effectWatch功能可以实现miniVue的雏形优化将代码抽离,effectWatch在框架中调用,视图的清空和append也在框架中调用优化并使用虚拟Dom在上面的代码中,每次都会更新所有节点,需要进行优化,只更新变化的节点将节点关键信息转化成一个对象。props是一个对象,
2024-12-05 14:43:20
460
原创 [Vue]Vue3
(1)监测机制的改变3.0 将带来基于代理 Proxy的 observer 实现,提供全语言覆盖的反应性跟踪。消除了 Vue 2 当中基于 Object.defineProperty 的实现所存在的很多限制:(2)只能监测属性,不能监测对象检测属性的添加和删除;检测数组索引和长度的变更;支持 Map、Set、WeakMap 和 WeakSet。(3)模板。
2024-12-04 17:48:02
927
原创 [Vue]生命周期和虚拟DOM
Vue 实例有⼀个完整的⽣命周期,也就是从开始创建、初始化数据、编译模版、挂载Dom -> 渲染、更新 -> 渲染、卸载 等⼀系列过程,称这是Vue的⽣命周期。beforeCreate(创建前):数据观测和初始化事件还未开始,此时 data 的响应式追踪、event/watcher 都还没有被设置,也就是说不能访问到data、computed、watch、methods上的方法和数据。
2024-12-04 17:37:25
625
原创 [Vue]Vue-router
(1)param方式配置路由格式:/router/:id传递的方式:在path后面跟上对应的值传递后形成的路径:/router/1231)路由定义2)路由跳转3)参数获取通过 $route.params.userid 获取传递的值(2)query方式配置路由格式:/router,也就是普通配置传递的方式:对象中使用query的key作为传递方式传递后形成的路径:/route?id=1231)路由定义2)跳转方法3)获取参数。
2024-12-03 18:09:46
905
原创 [Vue]依赖收集
computed 计算属性 : 依赖其它属性值,并且 computed 的值有缓存,只有它依赖的属性值发生改变,下一次获取 computed 的值时才会重新计算 computed 的值。watch 侦听器 : 更多的是观察的作用,无缓存性,类似于某些数据的监听回调,每当监听的数据变化时都会执行回调进行后续操作。运用场景:当需要进行数值计算,并且依赖于其它数据时,应该使用 computed,因为可以利用 computed 的缓存特性,避免每次获取值时都要重新计算。
2024-12-03 15:35:26
993
原创 [Vue]基础概念
当一个Vue实例创建时,Vue会遍历data中的属性,用 Object.defineProperty(vue3.0使用proxy )将它们转为 getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时通知变化。每个组件实例都有相应的 watcher 程序实例,它会在组件渲染的过程中把属性记录为依赖,之后当依赖项的setter被调用时,会通知watcher重新计算,从而致使它关联的组件得以更新。
2024-12-03 11:31:17
638
原创 [Vue]组件之间通信
(1)父子组件间通信子组件通过 props 属性来接受父组件的数据,然后父组件在子组件上注册监听事件,子组件通过 emit 触发事件来向父组件发送数据。通过 ref 属性给子组件设置一个名字。父组件通过$refs组件名来获得子组件,子组件通过$parent获得父组件,这样也可以实现通信。使用,在父组件中通过 provide提供变量,在子组件中通过 inject 来将变量注入到组件中。不论子组件有多深,只要调用了 inject 那么就可以注入 provide中的数据。(2)兄弟组件间通信。
2024-12-03 10:00:00
963
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅