- 博客(57)
- 收藏
- 关注
RSS订阅原创 触屏Touch事件总结（touchstart、touchmove、touchend 区别和使用场景）
web开发过程遇到触屏适配，需要使用到touch相关一系列事件，以下是开发过程查询的资料总结，以及遇到问题和解决方案。
2024-12-16 15:27:35
2398
原创 【umi】 国际化，在非组件文件中使用formatMessage
umi提供的国际化函数formatMessage 如果在自己封装的ts文件而非函数组件中使用，如果使用。使用此 api 会造成切换语言的时候无法自动刷新，请使用 useIntl 或 injectIntl。如果切换语言还是没成功，可以检查在使用umi的切换语言方法。又只能在hook函数式组件中使用。时，第二个参数要保持默认为true。
2024-10-17 09:10:13
444
2
原创 【JS】过滤数组中空值——arr.filter(Boolean)
过滤数组中的空值，包括 （undefined、null、“”、0、false、NaN）Boolean函数可以将一个值转换为布尔值，空值会被转换为false，非空值会被转换为true。
2024-07-03 10:45:55
1330
原创 【React 】折叠面板，点击展开时再请求数据
需求背景：使用折叠面板的形式展示数据，面板内部数据需要在打开时请求接口获取。遇到问题：最开始使用Antd 的折叠面板组件，它对于数据直接渲染是没问题的，但是不好满足打开面板时再动态加载数据的需求，于是自己手写了一个。效果展示(已脱敏)：话不多说，以下是手写的组件代码：面板的header 内容结构可以根据自己需要调整/* eslint-disable @typescript-eslint/no-unused-vars */import { DownOutlined, RightOut
2024-06-20 14:02:48
798
1
原创 日期格式化 yyyy-mm-dd 与 YYYY-MM-DD 大小写区别
前言：最近开发遇到日期格式化的问题，发现用 hh:mm:ss 格式化出来的时间是12小时制的。就想看看这个格式化字符串的大小写 有什么区别，下面是一些示例，（dateToFormat中是封装的库中formate方法）结果：可以看到，大小写是会对格式化结果产生影响的。
2024-04-26 11:51:07
3362
原创 【JS】判断对象是否为空4种方法总结
Object.keys() 是 ES5 新增的一个对象方法，该方法返回一个数组，包含指定对象自有的。obj.hasOwnProperty()可以判断是实例的属性还是原型链的属性。
2024-04-09 17:56:08
2098
原创 前端JS实现导出xlsx文件
亲测有用，只要前端能拿到的是表格全量数据，就能直接导出表格所有数据。但如果是后端分页查询的表格，前端每次只能查10条或20条的话，那当前每次也只能导出10条20条。不然的话需要前端存一下所有的数据才能一次导出所有，或者后端配合提供接口返回所有数据。需求背景： 需要导出表格的数据，由于后端不提供导出接口，所以由前端通过JSON数据导出实现。
2023-12-13 16:45:31
673
原创 【Antd】 RangePicker设置快捷日期 最近一周/月
记录在业务中，需用到antd的RangePicker组件设置快日期选择。如果在表单里设置默认初始值要用。
2023-11-10 15:22:57
1157
原创 【Ant Design Table + React】表格列伸缩实现
但我用这个插件后还是不太 OK，总有一些bug，比如如果拖动了不设置宽的列，整个伸缩就会变形；而且如果列数很多的情况下，自适应列效果不理想。需求背景：需要实现Antd Table 组件的列伸缩，宽度可以拖拽。在查阅资料时，看到有个大佬封装好了一个伸缩hook。必须保持一列宽度不设置，自适应。使用方便，效果理想，推荐使用这个插件。，使用起来方便简单。
2023-10-20 14:51:23
2152
原创 【控制台警告】[antd: Checkbox] `value` is not a valid prop, do you mean `checked`?
添加：valuePropName=“checked”报错的解决方式就是给。
2023-10-12 13:59:50
721
原创 前端实现展开收起的效果 (react)
需求背景：需要实现文本的展开收起效果，文本是一行一行的，数据格式是数组结构。简单实现：使用一个变量控制展开收起效果。
2023-09-08 10:27:22
1221
原创 JS实现IOS标准时间（JSON时间格式）格式转yyyy-mm-dd格式
【代码】JS实现IOS标准时间（JSON时间格式）格式转yyyy-mm-dd格式。
2023-08-04 10:37:22
2069
原创 Upload文件导入多条数据到输入框
参考：https://blog.youkuaiyun.com/weixin_66709443/article/details/130005481。需求场景：文本框内容支持批量导入(文件类型包括’.txt, .xls, .xlsx’)。使用AntD的Upload组件处理。下面是Upload的配置（伪代码），重点为beforeUpload中的逻辑。
2023-07-26 17:01:58
210
原创 Ant-Design组件中，在Modal 中加入Table组件，为什么Modal 关闭时 ，Table中数据不会更新重新渲染？有什么方法可以让表格中的数据重新渲染？
在Ant Design的Modal组件中，关闭Modal时，Table组件中的数据不会重新渲染的原因是，Modal组件默认是通过隐藏和显示来实现显示和关闭的，而不是通过销毁和重新渲染组件。以上方法中，可以根据具体情况选择适合的方法来让表格中的数据重新渲染。
2023-07-24 10:48:55
1642
原创 前端如何在需求开发完成后审查自己的代码
代码规范检查：首先，检查自己的代码是否符合项目或团队的代码规范。错误处理检查：检查代码中是否有合理的错误处理机制。例如，对异步操作的错误进行捕获和处理，避免出现未处理的异常。性能优化检查：检查代码中是否存在性能瓶颈和低效的操作。通过以上的审查步骤，可以帮助前端开发者发现潜在问题，提高代码质量，确保代码的正确性和稳定性。兼容性检查：检查代码在不同浏览器和设备上的兼容性。代码复审：如果有团队成员可以协助复审代码，可以请他人对自己的代码进行审查。他们可以提供宝贵的反馈和建议，帮助发现潜在的问题和改进代码质量。
2023-07-24 10:48:12
735
原创 Promise.all使用总结
当所有的 Promise 对象都成功完成后，Promise.all 返回一个包含所有结果的数组。在这个示例中，最终的结果是一个包含三个字符串的数组。后才会返回结果，如果其中任何一个 Promise 对象被 reject，整个 Promise.all 的返回结果也会被 reject。这个新的 Promise 对象会在所有的 Promise 对象都成功完成后，才会被 resolve，如果其中任何一个 Promise 对象被 reject，那么整个 Promise.all 的返回结果也会被 reject。
2023-07-14 15:22:13
449
原创 flex布局和white-space: nowrap； 冲突解决
虽然可以通过设置max-width或者min-width来限制元素的宽度，但我们的设备宽度是不固定的，所以设置一个固定的区间并没有用，我们需要的是这个元素它能在自适应的情况的下文本溢出依旧有效。flex: 1 表示：flex: 1 1 0%（第三个值flex-basis会默认添加单位）flex 布局下，想要设置文字不换行，并且超出部分省略号显示的效果。使用flex-basis：width失效，前者优先级高（MDN）一般来说应该解决了，但是 ，我设置了还是不起作用。给设置flex的元素设置。
2023-05-31 15:19:21
1557
1
原创 前端开发过程遇到的问题总结
问题背景：在表单中有一个上传文件的填写项，不过文件上传是同表单一起提交到后端的。有一个问题，移除上传的文件列表的时候，再次提交表单，并没有校验提示文件是未上传的。这会阻止浏览器缓存会话历史记录中的数据。若表单数据缓存于会话历史记录，用户提交表单后，再点击返回按钮返回之前的表单页面，则会显示用户之前输入的数据。如果即使在 autocomplete 已经设置为 off 时，浏览器仍继续提供输入建议，那么你需要更改输入元素的 name 属性。这会告诉浏览器，不要为了以后在类似表单上自动填充而保存用户输入的数据。
2023-04-27 15:33:01
662
原创 并查集学习
目录并查集学习代码模板：最简单的版本（易理解但效率较低）路径压缩版（优化）进一步优化——按秩合并并查集的题目练习亲戚问题并查集学习并查集用于解决元素分组的问题，管理一系列不相交的集合，并支持两种操作：合并：把两个不相交的集合合并一个集合查询：查询两个元素是否在同一个集合中参考：详细分析代码模板：最简单的版本（易理解但效率较低）初始化:int fa[MAXN];void init(int n){ for(int i=1;i<=n;i++) { fa[i]=i; }
2022-04-20 22:42:46
96
原创 PTA 刷题 L2-004 搜索树判断 (25 分)（二叉树的遍历）
L2-004 搜索树判断 (25 分)对于二叉搜索树，我们规定任一结点的左子树仅包含严格小于该结点的键值，而其右子树包含大于或等于该结点的键值。如果我们交换每个节点的左子树和右子树，得到的树叫做镜像二叉搜索树。现在我们给出一个整数键值序列，请编写程序判断该序列是否为某棵二叉搜索树或某镜像二叉搜索树的前序遍历序列，如果是，则输出对应二叉树的后序遍历序列。输入格式:输入的第一行包含一个正整数N（≤1000），第二行包含N个整数，为给出的整数键值序列，数字间以空格分隔。输出格式:输出的第一行首先给出判
2022-03-23 12:44:48
1920
1
原创 pta刷题之L2-003 月饼 (25 分)
月饼是中国人在中秋佳节时吃的一种传统食品，不同地区有许多不同风味的月饼。现给定所有种类月饼的库存量、总售价、以及市场的最大需求量，请你计算可以获得的最大收益是多少。注意：销售时允许取出一部分库存。样例给出的情形是这样的：假如我们有 3 种月饼，其库存量分别为 18、15、10 万吨，总售价分别为 75、72、45 亿元。如果市场的最大需求量只有 20 万吨，那么我们最大收益策略应该是卖出全部 15 万吨第 2 种月饼、以及 5 万吨第 3 种月饼，获得 72 + 45/2 = 94.5（亿元）。输入格式
2022-03-19 22:51:52
233
原创 PTA刷题之L1-020 帅到没朋友 (20 分）
L1-020 帅到没朋友 (20 分)输入格式：输入第一行给出一个正整数N（≤100），是已知朋友圈的个数；随后N行，每行首先给出一个正整数K（≤1000），为朋友圈中的人数，然后列出一个朋友圈内的所有人——为方便起见，每人对应一个ID号，为5位数字（从00000到99999），ID间以空格分隔；之后给出一个正整数M（≤10000），为待查询的人数；随后一行中列出M个待查询的ID，以空格分隔。注意：没有朋友的人可以是根本没安装“朋友圈”，也可以是只有自己一个人在朋友圈的人。虽然有个别自恋狂会自己把自己
2022-03-19 15:30:56
194
原创 PTA 天梯赛刷题之 L1-011 A-B (20 分)
L1-011 A-B (20 分)输入格式：输入在2行中先后给出字符串A和B。两字符串的长度都不超过10^4 ，并且保证每个字符串都是由可见的ASCII码和空白字符组成，最后以换行符结束。输出格式：在一行中打印出A−B的结果字符串。输入样例：I love GPLT! It’s a fun game! aeiou输出样例：I lv GPLT! It’s fn gm!#include<iostream>#include<algorithm>#include
2022-03-19 10:55:33
205
原创 PTA 天梯赛刷题之 L1-002 打印沙漏 (20 分)
L1-002 打印沙漏 (20 分)本题要求你写个程序把给定的符号打印成沙漏的形状。例如给定17个“*”，要求按下列格式打印***** *** * ********所谓“沙漏形状”，是指每行输出奇数个符号；各行符号中心对齐；相邻两行符号数差2；符号数先从大到小顺序递减到1，再从小到大顺序递增；首尾符号数相等。给定任意N个符号，不一定能正好组成一个沙漏。要求打印出的沙漏能用掉尽可能多的符号。输入格式:输入在一行给出1个正整数N（≤1000）和一个符号，中间以空格分隔。输出格式:首先
2022-03-19 10:38:51
127
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人