- 博客(59)
- 收藏
- 关注
RSS订阅原创 vue3实现markdown预览和编辑
Vditor是一款浏览器端的Markdown编辑器，支持所见即所得（WYSIWYG）、即时渲染（IR）和分屏预览模式。它具有以下特点：支持三种编辑模式：WYSIWYG、IR和SV内置流程图、甘特图、时序图等图表支持数学公式、音视频、代码高亮等丰富功能高度可定制化的主题和工具栏官网Vditor - 一款浏览器端的 Markdown 编辑器，支持所见即所得（富文本）、即时渲染（类似 Typora）和分屏预览模式 (b3log.org)Vditor允许完全自定义工具栏配置。toolbar: [
2025-04-05 22:43:33
387
原创 java-6验证码校验
SysUserServiceImpl类中的redis实例的key和value类型必须声明的和ValidateCodeServiceImpl类中一样。否则无法通过redisTemplate.opsForValue().get获取值，值永远为null。应该将校验验证码放在校验账号和密码之前，可以减少数据库操作，提高性能。3.如果为空或者不一致，提示用户校验失败（不区分大小写）在login方法中添加校验图片验证码的流程。1.获取图片验证码在redis中的key。4.如果一致删除redis中的验证码。
2024-12-20 15:17:53
184
原创 java-5图片验证码
/图片验证码生成方法@Service@Autowired@Override//1.通过工具生成图片验证码,hutool//长、宽、位数、干扰线数量//2.把验证码存储到redis中,设置redis的key：uuid,value:验证码，过期时间//获取验证码值//获取验证码图片//修改验证码突破原色(先改变背景色，然后重新生成图片，将图片转为base64)//3.返回ValidateCodeVo对象。
2024-12-20 15:15:53
450
原创 java-4自定义异常处理
Data // 生成get/set方法2.创建自定义异常类处理方法//全局异常处理@ResponseBody //处理返回的数据格式为json//自定义异常处理@ExceptionHandler(GuiguException.class)//此处传入自定义异常类的class，表示针对这种异常做处理3.使用。
2024-12-12 21:02:24
135
原创 java-1用户登录接口
在spzx-manager服务的src/resources目录下创建application.yml、application-dev.yml文件，文件的内容如下所示：导入mybatis-config.xml和logback-spring.xml配置文件-- 日志的输出目录 -->--控制台日志格式：彩色日志-->-- magenta:洋红 -->-- boldMagenta:粗红-->-- cyan:青色 -->-- white:白色 -->-- magenta:洋红 -->
2024-12-12 01:27:38
618
原创 安装redis
Redis的常用命令包括SET、GET、LPUSH、RPUSH、HSET、HGET等，用于操作Redis中的字符串、列表、哈希等数据结构。如果Redis服务器运行在不同的主机上或使用了非默认端口，可以使用redis-cli -h -p 来指定主机和端口。安装成功后，你可以通过Windows的服务管理器来修改Redis服务的登录身份（如果需要的话）。如果想方便地使用Redis命令，可以将Redis的路径添加到系统的环境变量中。使用redis-cli命令连接到Redis服务器。F:\服务端文件\Redis。
2024-12-09 23:00:06
553
原创 uniapp中如何进行微信小程序的分包
思路：在uniapp中对微信小程序进行分包，和原生微信小程序进行分包的操作基本上没区别，主要就是在pages.json中进行配置。此时需要在pages.json中的subPackages数组中新增一项。使用这个包中的页面时需要带上根路径的前缀，如进行tabbar页面的跳转。如图，我新增了一个包diver-page。pages代表这个包中所有的页面。root代表这个包的根路径。
2024-07-01 19:47:38
491
原创 uniapp如何根据不同角色自定义不同的tabbar
第二张思路就不赘述了，直接用上面的tabbar封装成组件引用即可，主要在pages.json中将tabbarlist设为空数组。1.第一种是根据登录时获取的不同角色信息，来进行 跳转到不同的页面，在这些页面中使用自定义tabbar。2.在tabbar页面中完成自定义tabbar，并完成根据激活的tabbar展示不同页面的逻辑。2.第二种思路是封装一个自定义tabbar组件，然后在所有要展示tabbar的页面中引入使用。1.根据手机号码一键登录，在回调中获取用户信息进行跳转。
2024-07-01 19:39:40
1072
原创 TS-元组
元组是TypeScript独有的新类型，通常用于表示长度较固定的数组，并可分别指定每个元素的类型。在JavaScript中并没有元组这一概念，TypeScript的元组编译成JavaScript的元组后，代码类型依然是数组，元组更多是在编译过程中起限定作用的，是一种“语法糖”。
2024-06-30 15:39:11
1001
原创 TS-字面量类型
例如，以下代码将变量number1声明为1、2、3字面量类型，因此取值只能为1、2、3中的一个，如果赋其他值，会引起编译错误。字面量在代码中表示固定值。在TypeScript中，字面量包括字符串、数值、布尔值、长整型值、对象、数组、函数、正则表达式、null等，例如，以下都是字面量。字面量类型的变量只能被赋予字面量值，如果尝试给以上变量赋其他值，就会引起编译错误，示例代码如下。基于字面量，创建字面量类型，字面量类型可以理解为仅表示固定值的类型，其定义方式如下。
2024-06-30 15:25:32
377
原创 px2rem配置黑名单忽略el-loading样式转换
配置.postcssrc.js中的selectorBlackList。使用px2rem发现el-loading样式被转换的很小。可以忽略调对应前缀的选择器。
2024-06-29 16:52:02
203
原创 代码提交检查husky+Lint-staged+Commitizen & cz-git
注意一定要使用pnpm来下载所有的husky包，不然到后面无法生成commit-msg钩子Husky + Lint-staged + Commitlint + Commitizen + cz-git 来配置 Git 提交代码规范。
2024-06-29 16:45:47
1969
原创 stylelint 配置
扩展 stylelint-config-recommended 共享配置并为 SCSS 配置其规则。扩展 stylelint-config-recommended 共享配置并为 Vue 配置其规则。共享 HTML (类似 HTML) 配置，捆绑 postcss-html 并对其进行配置。stylelint-config-recommended-scss 文档。stylelint-config-recommended-vue 文档。stylelint-config-html 文档。提供优化样式顺序的配置。
2024-06-28 12:57:02
780
原创 Eslint & prettier & airbnb规范 配置
这个配置项也是基于风格偏好的，一些人喜欢在最后一个元素后加上逗号（称为尾后逗号），因为这样在添加新元素时可以减少版本控制中的差异（只增加一行，而不是修改一行加一行）。段代码是Prettier代码格式化工具的配置文件的内容，通常存储为.prettierrc或prettier.config.js。Prettier是一个流行的代码格式化工具，用于确保代码的一致性和风格。这个配置影响代码的可读性和布局，2是一个比较常见的选择，因为它既保持了代码的紧凑，也足够清晰。eslint：代码质量检查工具。
2024-06-28 12:01:24
1944
原创 TS-常量枚举
如果使用普通的数值枚举或字符串枚举，在编译成JavaScript代码后会产生较多代码来支持各项功能，开销较大且可读性较差，而且很可能被人误用。此时如果编译这段代码，你可以发现它与普通枚举编译后产生的JavaScript代码存在区别。以下是普通枚举编译后产生的JavaScript代码。要定义常量枚举，只需在普通枚举的定义前面加上const关键字，示例代码如下。如果对常量枚举使用索引查找或反向映射，编译将无法通过，示例代码如下。以下是常量枚举编译后产生的JavaScript代码，整体上更精简。
2024-06-27 23:55:43
378
原创 docker部署vue项目
Docker Desktop启动的时候，有可能弹框提示"WSL2 installations is incomplete"，这是您的系统中没有安装WSL2内核的原因，打开。其中关键的部分是要开启电脑的虚拟化功能，在bios中打开即可，课直接百度如何通过bios打开电脑的虚拟化功能。,在打开的页面中有一个Linux内核更新包"链接，点击下载，安装。wsl --list --online 查看可以使用的虚拟机。docker会在当前目录下寻找dockerfile文件。需要依托于服务进行暴露访问。
2024-06-27 23:15:43
999
原创 使用axios+vue在离开页面时中断网络请求
第二步：在封装好的接口方法中加入cancelToken配置属性，并且传入this对象。最近做到一个需求需要在离开页面时中断未完成的网络请求。引入axios和CancelToken实例。第三步：离开页面时出发取消请求的方法。观察网络请求可以发现请求被取消了。
2024-06-02 23:47:37
512
原创 解决for in 遍历js对象，得到的顺序不正确问题
因为对象中没有顺序，他不是数组，所以想要得到一个顺序就首先要只给对象指定规则，这里是通过对象的value的字母来指定的规则。用for in之后发现每次得到的对象属性的顺序都不是按照后端数据源来排序的。最近在项目中需要遍历一个对象，按照顺序来渲染。
2024-06-02 23:45:23
567
原创 TS-引用类型的分类
复合引用类型通常都需要用户自行定义该类型的组成形式。例如，对于数组和元组，需要自行定义其组成类型和长度；对于函数，需要自行定义其参数、行为及返回值；对于对象或类的实例，则需要自行定义它们的成员、结构和行为。2.内置引用类型：包括Date（日期）对象、RegExp（正则表达式）对象、Math（数学）对象等。对于内置引用类型，通常已经由编程语言定义好该类型的结构、成员和行为，用户直接使用即可。1.复合引用类型：包括数组、元组、函数、对象、类的实例等。在TypeScript中，把引用类型分为以下两个大类。
2024-06-01 23:25:10
256
原创 TS-引用类型
TS中的数据值分为原始值和引用值两种类型。原始值即最简单的数据，而引用值则是有多个值构成的复合对象。原始值和引用值的声明方式类似，都需要创建常量或变量，然后对其赋值。其不同之处是，在变量或常量保存之后，可以对这个值进行的操作有所区别。
2024-06-01 23:22:58
1407
原创 TS-类型转换（显式）
要将其他类型转换为布尔类型，只需要将待转换的值传入Boolean()函数Boolean()函数会判断传入的值是空值还是非空值。若表示非空值，则返回true若表示空值，则返回false在TypeScipt中，以下5种值在一定程度上都有空值的含义，转换后会返回false，而对于其他值都会返回true1.undefined(无初始值)2.null(无值)3.NaN(非正确数字)4.05.""（空字符串）
2024-05-31 22:29:19
1777
1
原创 TS-object、Object和{}
object（首字母小写）类型是TS中新增的类型，用于表示非原始类型在TS中原始类型有number、boolean、string、bigint、symbol。因此object表示除此以外的全部类型以下赋值代码会引起编译错误以下为正确代码注意：当对象为object类型时，因为object类型是一种泛指的类型，并不是具体的类型，因此无法得知它支持哪些属性或者方法，需要将其转换为具体的类型才能操作。object类型可用于参数传递过程中的处理。
2024-05-31 21:53:40
757
原创 解决dataV库中滚动列表抖动的bug
最近在一个大屏项目组使用到了dataV库中的滚动列表，发现在滚动过程中第一行会抖动。猜测是表头的行高和row的行高不一样，每次滚动到表头的时候设置的行高冲突了。
2024-05-29 23:58:16
598
原创 webpack5零基础入门-19HMR的应用
HMR即HotModuleReplacement开发时，当我们修改了其中一个模块的代码webpack默认会将所有模块重新打包编译，速度很慢所以我们需要做到修改摸个模块代码，只对这个模块的代码重新打包编译，其他模块不变，这样打包的速度就能变快HotModuleReplacement（HMR/热模块替换）：在程序运行中，替换、添加或者删除模块，而无需重新加载整个页面。
2024-05-29 23:54:04
500
原创 webpack5零基础入门-18sourcemap的应用
webpack所谓的高级配置其实就是进行webpack优化，让代码在编译/运行时性能更好一般会从一下角度进行优化：1.提升开发体验2.提升打包构建速度3.减少代码体积4.优化代码运行性能SourceMap（源代码映射）是一个用来生成源代码与构建后代码一一映射的文件的方案。它会生成一个xxx.map文件，里面包含源代码和构建后代码每一行、每一列的映射关系。当构建后代码出错了，会通过xxx.map文件，从构建后的代码出错的位置找到映射后源代码出错的位置。
2024-05-21 13:59:53
548
原创 webpack5零基础入门-17CSS压缩
一样，但在 source maps 和 assets 中使用查询字符串会更加准确，支持缓存和并发模式下运行。可以看到css文件变成了一行。
2024-05-19 20:23:46
478
原创 webpack5零基础入门-16封装cssloader函数
我们发现配的cssloader中有很多重复性代码，所以应该对其进行封装，减少冗余的代码 3.修改rules4.重新打包效果依然一样
2024-05-17 12:36:19
450
原创 webpack5零基础入门-15样式兼容性问题处理
注意：postcss-loader要在css-loader后面配置。注意：postcss-loader要在css-loader后面配置。3.写一个flex布局，flex是存在一定的兼容性问题的。2.在webpack.config.js中配置。重新打包可以看到flex对ie进行了兼容处理。因为我们还要设置兼容到什么版本的浏览器。可以看到打包后未被处理。可以看到打包后未被处理。
2024-05-16 14:09:40
809
原创 webpack5零基础入门-14提取css为单独文件
Css文件目前被打包到JS文件中，当JS文件加载时，会尝试创建一个style标签来生成样式，这样对于网站来说，会出现闪屏的现象，用户体验不好。我们应该是单独的Css文件，通过link标签来加载性能才好。
2024-05-15 14:16:04
488
原创 webpack5零基础入门-13生产模式
生产模式是开发完成代码后，我们需要得到代码将来部署上线。这个模式下我们主要对代码进行优化，让其运行性能更好。优化代码运行性能优化代码打包速度。
2024-03-20 15:12:27
823
原创 webpack5零基础入门-12搭建开发服务器
每次写完代码都需要手动输入指令才能编译代码，太麻烦了，我们希望一切自动化。在webpack.config.js中添加devServer相关配置。注意：开发服务器不会输出资源，在内存中进行编译打包的。此时修改文件后，webpack会自动重新打包。执行npx webpack serve。
2024-03-19 09:43:15
815
原创 webpack5零基础入门-11处理html资源
可以看到打包后的html文件既保留了模版的结构又自动引入了js文件。主要是为了自动引入打包后的js与css资源，避免手动引入。进行打包可以看到打包后的文件夹中多了html文件。并且自动引入了dist.js。
2024-03-18 10:16:55
1004
原创 webpack5零基础入门-10babel的使用
主要用于将 ES6 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中。查看未配置babel前打包生成的dist.js可以发现箭头函数和...符号未被编译，还是es6的语法。因为只需要用到babel-loader我们不需要使用use直接用loader即可。因为只需要用到babel-loader我们不需要使用use直接用loader即可。/**排除哪些文件 */配置后重新打包发现编译成es5的语法了。JavaScript 编译器。
2024-03-17 21:33:25
669
原创 webpack5零基础入门-9eslint的用法
可组装的 JavaScript 和 JSX 检查工具。这句话意思就是：它是用来检测 js 和 jsx 语法的工具，可以配置各项功能我们使用 Eslint，关键是写 Eslint 配置文件，里面写上各种 rules 规则，将来运行 Eslint 时就会以写的规则对代码进行检查。
2024-03-16 10:17:17
994
原创 webpack5零基础入门-8清空前次打包文件与处理图标字体资源
再配置generator将filename变成"static/media/[hash][ext][query]"与图片配置类似，不同的是type变为asset/resource。可以看到dist中已经有了图标相关内容。即可以在打包前自动清空path目录。static下的media目录中。表示将资源不进行转换直接打包。即可将字体图标相关文件打包到。执行npx webpack。
2024-03-15 12:29:31
1089
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人