- 博客(145)
- 收藏
- 关注

原创 Husky + Lint-staged + Commitlint + Commitizen来配置 Git 提交代码规范
本文介绍 如何通过 Husky + Lint-staged + Commitlint + Commitizen来配置 Git 提交代码规范。核心内容是配置 Husky 的pre-commit和commit-msgpre-commit:Husky + Lint-staged 整合实现 Git 提交前代码规范检测/格式化 (前提:ESlint + Prettier + Stylelint 代码统一规范);commit-msg。
2024-08-21 14:10:38
876

原创 nodejs:使用nvm实现nodejs多版本管理及切换版本
nvm list 查看已经安装的node版本(简写:nvm ls)1.打开安装nvm 文件目录,打开settings 增加镜像源。查看安装列表,* 代表正在使用的版本默认是没选中的需要通过。nvm version 查看版本(简写:nvm -v)nvm list available 查看可安装版本。nvm use 使用哪个node 版本。
2024-08-20 12:11:08
431

原创 Vue 3 中创建一个动态的组件实例
本文将介绍如何在 Vue 3 中实现一个动态 Toast 组件实例。我们将创建一个简单的 Toast 组件,并使用一个动态创建实例的脚本来显示 Toast 消息。
2024-07-11 09:58:06
934

原创 使用 ResizeObserver 进行元素大小变化监听 el-scrollbar滚动区域
是一个用于监听 DOM 元素大小变化的接口。它允许开发者注册一个回调函数,当指定的元素大小发生变化时,该回调函数会被调用。这在响应式布局、图表重绘以及处理动态内容的情况下非常有用。
2024-07-09 10:10:05
600

原创 基于Pinia的WebSocket管理与优化实践(实现心跳重连机制,异步发送)
基于Pinia的WebSocket管理与优化实践(实现心跳重连机制,异步发送)
2024-07-05 09:04:52
1011
4

原创 vue2+ eslint + prettier代码风格统一
接手一个vue2 老项目发现项目格式化失效,重新配置eslint + prettier 保持代码风格统一。
2024-04-10 16:42:41
631
1

原创 el-select 中加了filterable 点击箭头下拉框回收不去问题
【代码】el-select 中加了filterable 点击箭头下拉框回收不去问题。
2022-11-17 19:08:15
883
2

转载 v-for 更新检测中过程
1.v-for更新监测情况1: 数组翻转情况2: 数组截取情况3: 更新值口诀:数组变更方法, 就会导致v-for更新, 页面更新数组非变更方法, 返回新数组, 就不会导致v-for更新, 可采用覆盖数组或this.$set()<template> <div> <ul> <li v-for="(val, index) in arr" :key="index"> {{ val }} </
2021-12-25 18:55:52
171

转载 Vue全家桶-项目优化上线
1. 项目优化1.1 项目优化策略生成打包报告第三方库启用 CDNElement-UI 组件按需加载路由懒加载首页内容定制1. 生成打包报告打包时,为了直观地发现项目中存在的问题,可以在打包时生成报告。生成报告的方式有两种:① 通过命令行参数的形式生成报告// 通过 vue-cli 的命令选项可以生成打包报告 // --report 选项可以生成 report.html 以帮助分析包内容 vue-cli-service build --report② 通过可视化的UI面板直接
2021-10-08 10:29:05
201

原创 数组一些案例 (重点)冒泡排序.插入排序经典面试题
计算数组和平均值求数组 [2,6,1,7, 4] 里面所有元素的和以及平均值。案例分析① 声明一个求和变量 sum。② 遍历这个数组,把里面每个数组元素加到 sum 里面。③ 用求和变量 sum 除以数组的长度就可以得到数组的平均值 // 1. 求数组 [2,6,1,7, 4] 里面所有元素的和以及平均值。 // (1)声明一个求和变量 sum。 // (2)遍历这个数组,把里面每个数组元素加到 sum 里面。 // (3)用求和变量 su
2021-04-15 16:55:51
309
原创 使用 Vue 3 实现打字机效果
我们首先创建一个自定义指令 v-typewriter,用于实现打字机效果。这个指令将逐字显示绑定的文本内容。// 设置延迟时间,默认150mslet i = 0;i++;在 Vue 组件中使用自定义指令 v-typewriter。该指令会在元素挂载时自动触发,逐字显示文本内容。
2024-07-09 11:50:34
1780
原创 05-java数组
> 数组概念> 数组的定义> 数组的静态初始化> 地址值> 数组元素访问> 数组索引> 数组遍历,> 数组动态初始化> 数组的两种初始化方式的区别> 数组常见问题> 数组练习
2022-09-26 16:36:34
272
原创 day02-Java基础-注释,关键字,字面量,变量,数据类型,标识符,键盘录入,IDEA相关
> Java基础之注释,关键字,字面量,变量,数据类型,标识符,键盘录入方法,IDEA相关使用
2022-09-23 17:01:37
505
原创 01-TypeScript 介绍-TypeScript常用类型
TypeScriptTypeScript 介绍TypeScript 初体验TypeScript 常用类型TypeScript 高级类型TypeScript 类型声明文件在 React 中使用 TypeScriptTypeScript 介绍TS 官方文档TS 中文参考 - 不再维护[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-qOzCqWh9-1646827195897)(./images/TS_logo.png)]TypeScript 是什么
2022-03-09 20:02:22
1132
1
原创 vue3基础
Vue3快速上手1.Vue3简介2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王)耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者github上的tags地址:https://github.com/vuejs/vue-next/releases/tag/v3.0.02.Vue3带来了什么1.性能的提升打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%…2.源码的升级使用Proxy
2022-02-22 19:36:27
229
原创 redux课程
课程说明目的:为React移动端项目做支撑:redux、redux-thunk、react-redux(useDispatch、useSelector )、redux-devtools-extension内容顺序(课程目标):redux单独使用react-redux 结合react项目进行使用中间件react-thunk的基本使用useDispatch, useSelector的基本使用redux模块管理redux-devtools-extensionRedux基本介绍基本介绍概
2022-02-11 21:19:48
342
原创 08-hooks进阶-useRef-useContext-React.memo高阶组件
Hooks其他APIuseRef hookimport { useRef } from 'react' <input className="new-todo" placeholder="What needs to be done?" autoFocus onKeyUp={onKeyUp} ref={inputRef} /> const App = () => { const [col
2022-02-09 17:07:33
946
原创 07-hooks基本使用-useState-useEffect-自定义hooks
React Hooks基础React Hooks 介绍React Hooks 基础React Hooks 介绍Hooks 是什么为什么要有 HooksHooks 是什么Hooks:钩子、钓钩、钩住Hooks 是 React v16.8 中的新增功能作用:为函数组件提供状态、生命周期等原本 class 组件中提供的 React 功能可以理解为通过 Hooks 为函数组件钩入 class 组件的特性注意:Hooks 只能在函数组件中使用,自此,函数组件成为 React 的新
2022-02-06 21:34:37
1920
原创 06-react-组件复用-render-props技术
mixins(已废弃)https://react.docschina.org/blog/2016/07/13/mixins-considered-harmful.htmlmixin引入了隐式依赖关系对于组件中的方法和数据的来源不明确,不容易维护Mixins 导致名称冲突Mixins 导致滚雪球般的复杂性render-props技术组件复用的说明思考:如果两个组件中的部分功能相似或相同,该如何处理?处理方式:复用相似的功能(联想函数封装)复用什么?1. state
2022-02-06 21:32:14
780
原创 05-react原理-setState-组件更新机制-组件性能优化
setState更新数据setState() 是异步更新数据的注意:使用该语法时,后面的 setState() 不要依赖于前面的 setState()1. 当你调用 setState 的时候,React.js 并不会马上修改 state (为什么)2. 而是把这个对象放到一个更新队列里面3. 稍后才会从队列当中把新的状态提取出来合并到 state 当中,然后再触发组件更新。可以多次调用 setState() ,只会触发一次重新渲染this.state = { count: 1 }
2022-01-20 21:31:05
831
原创 04-react组件生命周期
组件的生命周期概述意义:组件的生命周期有助于理解组件的运行方式、完成更复杂的组件功能、分析组件错误原因等组件的生命周期:组件从被创建到挂载到页面中运行,再到组件不用时卸载的过程钩子函数的作用:为开发人员在不同阶段操作组件提供了时机。只有 类组件 才有生命周期。生命周期的整体说明每个阶段的执行时机每个阶段钩子函数的执行顺序每个阶段钩子函数的作用http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/挂载阶段执行
2022-01-20 21:29:33
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人