- 博客(57)
- 资源 (4)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 React 实现PDF预览（数据源使用文件流而不是url）
应公司要求，需要进行上传文件（pdf）的预览功能，网上大部分都是使用url作为预览数据源，但是现在后端那边只返回了pdf文件流，所以本文主要是用文件流来预览pdf。
2024-09-02 18:27:15
940
原创 使用ant design的modal时，发现自定义组件的样式（组件高度）被改变了！
在项目中，自定义了一个组件，分别在界面和 antd的modal中都有使用到。但是突然发现，。modal中的组件整体要比页面中的组件要高一点。项目中的自定义组件比较复杂，因此，自己写了一个简单的测试功能，如下所示：如上图，可以看到，常规div的样式整体比modal中的div要矮一点（差别不是特别大）。
2024-08-09 17:31:56
417
原创 实现点击Button，改变背景颜色（多个按钮互斥显示）
在界面中，有一组button，现在需要实现下面功能：点击其中一个，改变被点击button的背景颜色。当点击下一个之后，之前点击过的按钮背景颜色还原，当前被点击的button背景色又被改变。效果如下图：当点击了test1，test1的背景色变为了红色。再继续点击test2，test2的背景色变为了红色，而test1的背景色还原。
2024-07-04 20:21:08
987
原创 修改 ant design tour 漫游式导航的弹窗边框样式
应项目要求，调整ant design tour 弹窗边框的样式。tour 原本样式是有遮罩层，因此没有边框看起来也不突兀。原图如下：但是UI设计是取消遮罩层，并设置边框样式。当 取消 了遮罩层，没有设置边框样式的图片如下：由上可以看出，不设置边框的tour似乎跟网页页面融合了在一起。因此，就需要设置边框。
2024-05-23 20:29:51
549
原创 draw.io 网页版二次开发（3）：打包和部署（war包）
这个专栏算是结束了。很多都是自己摸索而来，肯定有不全之处，如果大家发现更好的东西，还请不吝赐教！
2024-05-11 15:32:58
1456
3
原创 draw.io 网页版二次开发（2）：开始修改代码
代码的修改就到这里了。以后要是有其他的记录，我会继续补充。下一章开始写draw.io的打包和部署。
2024-05-10 21:32:56
2674
5
原创 draw.io 网页版二次开发（1）：源码下载和环境搭建
通过上面的步骤，就再本地通过代码运行起来了drawio网页版。下一篇文章将进行drawio的二次开发流程。
2024-05-10 20:00:30
1301
4
原创 了解CSS中的BFC以及用法
BFC 即 Block Formatting Contexts (块级格式化上下文)，属于上面提到的定位方案中的普通流。我们可以把BFC看成页面中的一块渲染区域。它有自己的渲染规则。简单来说，BFC可以看作元素的一种属性，当元素拥有了BFC这个属性的时候，这个元素就可以看作是隔离了的独立容器。容器里面的元素不会在布局上影响到外面的元素。
2024-04-11 14:20:30
675
原创 关于npm和yarn的使用（自己的问题记录）
如果将node_modules目录删除，使用npm install安装所有依赖，自行安装的依赖不会被安装，如果使用，需要再次手动安装（npm install xxx）。如果node_modules目录被删除了（或者程序拉下来后需要初始化），使用npm install 可以自动安装所有的依赖。1. npm install xxx --save : 命令是安装模块到项目node_modules目录下，中的包会被安装到项目中。安装命令：npm install echarts --save-dev。
2024-04-07 17:53:57
1208
原创 win11安装wsl报错：无法解析服务器的名称或地址
项目开发中，需要用到wsl，因此根据wsl官方（）命令进行wsl的安装。而本文主要是记录自己在安装wsl中遇到的问题 “” 的解决办法。
2024-04-03 16:37:43
15185
9
原创 关于自己Nginx的使用（ant design pro 部署）
工作需要部署 ant design pro 框架开发的前端程序，并且需要有用到代理。就选择了nginx部署。
2024-03-19 11:57:44
1619
原创 关于修改ant design中 transfer 选中条目提示的标题
在项目中使用到了antd transfer（穿梭框）功能，发现自带的选中提示跟项目UI设计不符。
2024-03-18 11:59:07
591
原创 记录一次使用ant design 中 ConfigProvider来修改样式导致样式改变的问题（Tabs嵌套Tabs）
如代码所示，外层Tabs中又包含了一个内层的Tab，因此内层的Tabs样式也会被 ConfigProvider 所影响，导致内层Tab样式跟外层Tab样式一样。要想只改变外部Tabs样式，而内部样式不变的方法，我只知道，通过ConfigProvider还原内部Tabs样式。在修改外层tabs样式时，使用到了antd5中的ConfigProvider，通过token进行样式修改。
2024-02-01 14:28:33
868
原创 获取鼠标点击图片时候的坐标，以及利用html 中的useMap 和area 实现图片固定位置的点击事件
获取鼠标点击图片时候的坐标，以及利用html 中的useMap 和area 实现图片固定位置的点击事件。
2024-01-29 15:00:10
2160
原创 antd5 Tabs 标签头的文本颜色和背景颜色修改
在项目中使用Tabs标签页，由于设计和antd原始样式的差异，需要对标签头部的背景颜色和字体做修改。
2024-01-12 10:41:35
1863
原创 搭建react+ant design pro+umi 项目框架
我搭建react+antd+umi这个框架的原始资料主要是来源于而我写这篇文章的本意就是用来记录我用搭建时候的步骤汇总。
2023-12-24 18:48:05
2688
2
原创 在webstorm中配置sass编译环境
建立之后会自动生成.css文件和css.map文件即可，里面的写的sass样式会转为css样式。以上ruby和sass都安装成功之后，就开始配置webstorm。查看版本号，如果有版本号则表示安装成功，如果没有则表示没成功，则需要重新安装。安装成功后会在末尾显示：5 gems installed。，回车后进行安装步骤（一定要保证网络稳定，不然可能安装失败）。在webstorm中建立文件scss文件测试。在html界面引用的时候还是引用css后缀的文件。ruby安装成功后，打开cmd命令行，输入。
2023-11-15 20:34:51
1392
原创 mysql 在nodejs中的简单使用（增删改查）
在另外一篇文章还看到下面这种方式，还未验证过。先放到这里（根据这种方式还可以尝试一下另一种批量新增方式）。（1） 新增（insert）一行。另外看到的方式（用这种方式可以尝试一下批量修改）
2023-08-16 18:25:14
689
原创 JS 循环中使用await
程序中，有时候需要在循环中按照顺序进行数据操作，但是又有异步的动作，所以就希望用await。for、for of、for await of是生效的，forEach的await是不生效的；for、for of是await这一行代码在等待，for await of是整个for在等待；，我写这篇只是为了记录结论。2. 验证过程请参考原文。，我这里只展示验证结果。前言：整篇文章参考原文。
2023-06-25 17:59:33
1307
原创 关于linux服务器上生成的图片中文字为的乱码问题
（4）执行：fc-cache -fv。自己建一个文件夹（myFont），把想要的字体拖进去，（可以看到拖进去之后可以看到三个文件）。linux服务器后端生成图表（使用了canvas和echarts），并将生成的图片发送到企业微信群里。最后：fc-cache -fv运行成功之后按理说放进去的字体就安装成功了。在本地windows系统下文字中选一个自己想要的文字（我选了微软雅黑）。字体安装之后，重新运行了程序，可以看到图片上已经展示中文了。生成的图表中文展示不出来，是乱码。执行相关命令，安装放进去的字体。
2023-06-16 11:05:20
1844
原创 记录一次使用__dirname和./引出的bug
但是在获取这张图片的时候我使用的是“找了好久都不知道为什么会找不到这张图片。下面是网上查的资料截取的一部分。还是有区别的（我之前以为没区别）。
2023-06-14 18:40:01
1152
原创 因 yarn.lock 引发的事故（对你们来说应该是故事，哭唧唧）
我又进行第二个猜想：提交到git上的代码没有提交全，或者合并代码的时候合并掉了。然后为了对比git上的代码，又就将上传后的代码clone下来，跟我本地源码进行对比。猜怎么着，--------对应的功能代码完全相同-------当时我整个人就郁闷了。突然，就在对比代码的时候发现有一个yarn.lock不一样（之前我没有把yarn.lock上传到git，所以在yarn install 的时候会再生成），然后我在网上查了一下yarn.lock的作用（我是一个小菜鸟）。这证明我代码是没问题的。我感觉我发现问题了。
2023-03-30 11:18:03
1288
原创 antdesign踩坑日记-Cascader属性之displayRender
级联选择中想同时使用displayRender和multiple属性时候，ant 最低版本都应该是4.18.0。
2023-02-19 11:01:30
1170
原创 ag-grid 表格数据更新
有时候我们会涉及到数据更新，但是又不想刷新整个页面，那么就可以单独对表格中的数据进行更新。以下有三种更新情况：表格整个数据的更新；更新一行数据；更新单元格数据。最初的表格数据如下图：一 更新整个表格的数据 使用setRowData方法。 function resetGrid() { //新的数据项 const Newdata = [ { id: "dd", name: '...
2021-10-27 17:37:57
5731
原创 ag-grid 自带css样式记录
本篇文章是打算自己用于记录ag-grid自身的css样式的记录和功能。 1..ag-header-group-cell-with-group 作用：多表头，前几层（最后一行表头除外）表头样式的设置。 .ag-header-group-cell-with-group { background-color: gold; color: red; } ...
2021-09-18 12:05:20
1675
5
原创 ag-grid 表头样式（颜色渲染）
一 整行表头渲染同一个样式： 这种比较简单，直接设置css 样式，现在还缺第二行背景颜色的设置。具体css样式如下： /* 第一行表头的样式 */ .ag-header-group-cell-with-group { background-color: gold; color: red; } /* 第二行表头的字体设置 */ .ag-hea...
2021-09-18 11:55:36
3778
原创 ag-grid 设置行高
ag-gird 表格原生行高实在太宽,现在需要将行高缩小一点.以下将对表格的两种情况进行设置:1.普通表格数据展示(无分组情况) 效果如图所示:设置步骤: (1) .rowHeight:设置数据行行高;headerHeight设置表格表头行高, rowHeight: 28, // 设置表格行高 headerHeight: 30, // 设置表格表头的行高 (2).在defaultColDef中设置cellStyle.的line-height....
2021-09-13 20:42:17
3561
原创 Echarts-折线图-设置线条颜色以及线条以下区域显示渐变颜色
首先，先看折线图效果。1.设置线条颜色： 在series中，数组项设置lineStyle属性。 lineStyle: { // 设置线条的style等 normal: { color: 'red', // 折线线条颜色:红色 }, },2.设置线条上点的颜色（也是图例的颜色）在series中，使用itemStyle属性。 ...
2021-09-10 10:33:50
24507
4
原创 ag-grid 自适应大小
ag-grid 表格需要自适应浏览器窗口大小，以下为没有自适应的情况：以下为已经自适应的情况：如果需要自适应，统一调用api：sizeColumnsToFit()即可，只不过调用的触发事件不同。 分别有以下三种情况出现：情况1：表格初始化完毕后自适应浏览器大小。触发事件：ag-grid中的onGridReady事件：在表格ok后调用，适应浏览器大小。情况2：当浏览器页面大小没变，但是表格大小有变化时，也重绘至自适应浏览器大小。触发事件：ag-grid中的onGri...
2021-09-03 14:15:30
5073
原创 ag-grid 单元格编辑-下拉框
一、基本下拉框 效果如下：选中后的值直接就是界面显示的值（也是代码中定义的值）。效果如下：二、有id 的下拉框 这个下拉框跟平常用的select 框类似，设置id和value，在界面选择的时候显示的是value值，但是选中值后，后台获取到的被选中值是value对应的id值。具体效果如下：以上两个例子的代码如下：<!doctype html><html><head> <met...
2021-08-27 18:17:58
4608
5
Ag-Grid Demo2.7z
2020-06-10
Ag-Grid Demo.7z
2020-06-10
升级antd v4到v5
2023-03-16
winform国际化问题（SaveFileDialog和DateTimePicker）
2018-07-14
TA创建的收藏夹 TA关注的收藏夹
TA关注的人