- 博客(52)
- 资源 (5)
- 收藏
- 关注
RSS订阅
原创 【配置】雷池WAF社区版安装
雷池（SafeLine）是长亭科技耗时近 10 年倾情打造的 WAF，核心检测能力由智能语义分析算法驱动。WAF 是 Web Application Firewall 的缩写，也被称为 Web 应用防火墙。区别于传统防火墙，WAF 工作在应用层，对基于 HTTP/HTTPS 协议的 Web 系统有着更好的防护效果，使其免于受到黑客的攻击。
2024-05-16 10:11:18
738
原创 【前端】桌面版docker并部署前端项目
使用阿里云的容器加速，访问下面地址去获取加速链接。上面的xxx换成自己获取的。先build打包生成dist文件夹，只配置dockerfile文件即可，镜像配置加速，在settings—>docker engine下。docker桌面版和模拟器只能选一个，不然一直转圈圈。点MB后面的开始图标去配置一下，可以先本地测试。最简单配置如下：比较好的配置去网上找找。官网下载安装包并安装4.29.0版本。win10专业版 2004+ ,vue项目打包成docker镜像。云服务使用 打开9090端口。
2024-05-11 18:59:42
406
原创 【前端】项目Vue2升级Vue3注意事项
Vue2项目页面直接迁移到Vue3环境下，依旧2的写法，页面各种报错，尤其element-ui升级组件改动比较大；
2024-04-09 17:00:03
1040
原创 【Bug】vue3中使用echarts发现ncaught TypeError: Cannot read properties of undefined (reading ‘type‘)
因为用的setup语法，将这个值响应式去掉。
2024-03-20 16:00:59
126
原创 【前端】国际化实现过程
确定初始化的语言在setting中，页面加载会读取里面的语言走一次语言的初始化配置，后面就是按钮切换。安装依赖，配置，当点击中英文切换按钮时候，全局变换，element-plus组件也需要中英文切换。src下新建文件夹lang，再新建package文件夹同级别index.js。package下的en.json和zh-cn.json，类似下面。一开始确认默认的语言.main.js中配置ep的。其中setting是自定义的配置。走小仓库app.js。
2024-03-18 14:19:50
581
原创 【前端】字典获取过程
登录成功后，去路由守卫那获取用户名，如果有则放行，没则请求用户信息以及权限菜单和字典表等信息，存入浏览器缓存中，在需要的下拉框或者表格中使用，每次后端新增字典，前端需要在utils中的字典工具类中DICT_TYPE里加上对应的常量。utils里的字典工具类。
2024-03-18 11:43:03
742
原创 【前端】vscode快捷键和实用Api整理
切记，最好一个]要手输才有提示,代码右键使用插件Live Server打开浏览器查看效果。只需在我们的 URL 后添加您想要的图像尺寸（宽度和高度），您就会获得随机图像。生成5张图片，200*300的，再300后面加个]回车即可。由于浏览器缓存，则会5张图片会长一样，只需要300后面加个。开发静态页面没有数据的时候可以用它来占位。要获得正方形图像，只需添加尺寸即可。创建a.html 生成模板。div.lucky+回车。
2024-03-10 13:31:50
564
原创 【前端】原子化UnoCSS使用
有时候我们会遇到样式复用的情况，需要将一些相同的样式提取到一个 class 中。手动将每个原子粒的样式提取出来非常耗时耗力。曾经使用过 Bootstrap，但它会将没有使用到的类样式也打包到生产环境中，影响了性能。我们需要的是只打包使用到的样式，而不包括没有使用到的。UnoCSS 应运而生，它让我们能够实现“原子化 CSS”的构想。
2024-03-07 14:17:14
781
原创 【前端】Vite打包页面简单部署到GitHub上
vite打包的配置如图，base是仓库名称，docs是build后生成的打包目录。访问就是第一张图里的一串地址，这种方式比较方便吧。注意点已经打上箭头,代码我传到的是test分支。创建仓库---->上传代码---->设置。上传到GitHub就自动部署了。
2024-03-05 17:46:05
578
原创 【前端】i18n Ally插件使用
再如我的翻译文本是en.json和zh-CN.json，都在src目录下的lang/package下，配置就如下。比如我的翻译文件en.ts和zh-CN.ts，都在src目录下的locales目录，配置就如下。由于每个项目的语言可能做的都不一样，会导致无法找到真正的路径位置，所以我推荐。在项目的根目录找到.vscode再找到settings.json编辑它。如果发现翻译是英文的则看下vscode右下角的en改一下即可。vscode扩展搜i18n Ally。
2024-03-05 15:30:41
4023
6
原创 【Bug】表单中的输入框按下回车会刷新页面
解决：在element表单中加入 @submit.native.prevent。原因：Form标签内有输入框时，按下回车键会默认触发表单的提交操作。
2024-02-29 18:12:00
374
原创 【前端】数据处理
2、验证必填*数据不能为空，再读取流格式Excel时候为空的转换为-4、将数据处理成elementUi里表格需要的数据。补充方法去掉*返回elementUi中表头的格式。3、将数组处理成elementUi中表头的格式。1、校验是否缺少必填字段。
2024-02-26 15:55:06
403
原创 【前端】Vue中引入excel模板并下载以及XLSX封装使用
我使用XLSX的场景，在我上传excel的时候，我需要获取它的表头以及里面的数据进行渲染到表格中，在我编辑的时候需要请求Excel的地址，将返回流转JSON也拿里面的表格数据。新增配置，在vue.config.js中，自己比较一下，最后一段新增的chainWebpack。src/assets/excelTemplate/模板.xls。即可将模板下载到本地。
2024-02-19 10:56:33
3320
原创 【前端】弹框组件
vue2项目，封装的第一版弹框组件使用基于elment-ui。在vue同级创建components/dialog文件夹。里面放paramDialog.vue。
2024-02-02 14:50:51
429
原创 【Bug】Node18问题error:0308010C:digital envelope routines::unsupported
在package.json里启动如dev的值里加下面前缀即可。node升级18后，项目启动又遇到的问题。
2024-02-01 15:56:11
382
原创 【Bug】Nvm安装Node18出现tls: failed to verify certificate: x509: certificate has expired or ...
nvm目录下找到 setting.txt里，将以前配置的。
2024-02-01 15:37:40
933
原创 【后端】乐观锁和悲观锁
悲观锁：由于悲观锁可能对系统的吞吐性能造成影响，因此它更适合应用于写操作较多的场景。乐观锁：乐观锁的设计目的是为了避免悲观锁带来的缺点，因此更适合应用于读操作较多的场景。
2024-02-01 10:16:39
662
原创 【前端】echarts最少留下一个图例
需求是，有多个的legend配置，正常情况echarts可以全部点击取消掉，现在需要最少保留一个。用一个监听即可解决 myChart是图表实例。
2024-01-30 14:39:09
441
原创 【前端】防抖和节流
项目中遇到的场景，需要鼠标悬浮在图表的时候，将ToolsTip里的数据回显到头部，由于是2张图表，无法直接赋值，必须通过请求后端接口，由于ToolsTip里的Api是鼠标放上面就会触发，就会出现发起了N个请求，这时候就可以利用防抖，只有一定时间没有动作，才会请求后端接口。防抖用于限制连续触发的事件的执行频率。当一个事件被触发时，防抖会延迟一定的时间执行对应的处理函数。如果在延迟时间内再次触发了同样的事件，那么之前的延迟执行将被取消，重新开始计时。监听echarts的tooltip 事件。
2024-01-29 18:57:12
729
原创 【Bug】npm安装包时候报certificate has expired
【代码】【Bug】npm安装包时候报certificate has expired。
2024-01-24 09:11:16
540
原创 【设计模式 创建型】单例模式
1、单例模式保证了系统内存中该类只存在一个对象，节省了系统资源，对于一些需要频繁创建销毁的对象，使用单例模式可以提高系统性能。2、当想实例化一个单例类的时候，必须要记住使用相应的获取对象的方法，而不是使用 new。3、单例模式使用的场景：需要频繁的进行创建和销毁的对象、创建对象时耗时过多或耗费资源过多（即：重量级对象），但又经常用到的对象、工具类对象、频繁访问数据库或文件的对象（如：数据源、session 工厂等）
2024-01-19 16:07:31
1126
原创 【设计模式 行为型】策略模式
通过策略模式，我们可以轻松地在运行时切换不同的支付方式，而不需要改动客户端代码。策略模式将算法的选择和使用进行了解耦，提高了代码的灵活性和可维护性。同时，策略模式也符合开闭原则，当需要新增一种支付方式时，只需要添加新的具体策略类即可，无需修改原有代码逻辑。这样，客户端代码与具体的支付算法解耦，可以动态地在运行时切换支付策略。该模式通过将算法封装成独立的类，使得它们可以相互替换，而不影响使用算法的客户端代码。因此，采用策略模式能更好地解决这些问题，实现代码的松耦合和可维护性。，并有两个具体的策略类。
2024-01-19 16:00:03
568
原创 【设计原则】单一原则S
随着业务的发展，如果这个粗粒度的类变得庞大且代码量增加，这时候，我们可以对其进行持续重构，将其拆分成更细粒度的类。换句话说，我们不应该设计臃肿的类，而是应该设计粒度小、功能单一的类。从另一个角度来看，如果一个类包含两个或更多不相关的业务功能，那么我们可以说它的职责不够单一，应该将其拆分成多个职责更加独立、粒度更细的类。的是，单一职责原则并非绝对规定，而是需要根据具体情况来判断是否需要进行类和模块的拆分。不同的应用场景、不同阶段的需求背景下，对同一个类的职责是否单一的判定，可能都是不一样的。
2024-01-19 11:16:44
421
原创 【配置】加速访问Github
电脑里找到Microsoft Store软件。打开 搜Watt Toolkit下载并打开。勾选Github，在点击一键加速即可。
2024-01-18 16:00:48
503
原创 【Bug】ssh连github报Connection closed by 127.0.0.1 port 22
将.ssh下pub打开复制并粘贴到 key 对应文本框 在 title 文本框里任意写一个名称。登录 github 点头像-setting-ssh and…-New SSH key。3、在 C:\Users\Administrator.ssh 中添加config文件。原因是代理封禁了 Github 端口 22 的连接。2、检查邮箱是否对，并重新配置。
2024-01-18 11:52:57
768
原创 【前端】vue3和vue2区别
响应式系统的性能优化：Vue 3 使用 Proxy 替代了 Vue 2 中的 Object.defineProperty，这使得响应式系统在性能上有所提升。Proxy 的实现方式更高效，可以一次性拦截整个对象或数组，而不需要逐个定义属性，从而提高了大型对象或数组的性能。虚拟 DOM 的优化：Vue 3 在虚拟 DOM 的实现上进行了一些优化。
2024-01-16 17:55:01
1142
原创 【Bug】Idea插件docker连云服务器出现com.intellij.docker.agent.ApiTaskException异常以及其他异常
【代码】记录：Idea插件docker连云服务器出现com.intellij.docker.agent.ApiTaskException异常。
2023-12-06 14:18:43
755
4
原创 【Bug】qq登录引入的Sdk4J与codec出现 Base64冲突
发现QQ的第三方登录SDK包重写了apache的base64，而且包名都一样，导致找不到对应的方法。这是因为java的类加载机制是，加载了这个类后遇到相同的就不会再加载了。将 这个依赖放在codec依赖的后面即可。
2023-12-04 09:33:47
395
原创 【前端】AntV X6学习笔记
/ 注册自定义模板节点 'custom-image'width: 62, // 节点宽度height: 62, // 节点高度markup: [selector: 'body', // 节点外部矩形},},},],attrs: {body: {stroke: 'green', // 外部矩形边框颜色fill: 'pink', // 外部矩形填充颜色},image: {refWidth: '100%', // 图片宽度和节点宽度一致。
2023-11-16 15:11:15
2290
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人