- 博客(45)
- 资源 (4)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 了解CSS中的BFC以及用法
BFC 即 Block Formatting Contexts (块级格式化上下文)，属于上面提到的定位方案中的普通流。我们可以把BFC看成页面中的一块渲染区域。它有自己的渲染规则。简单来说，BFC可以看作元素的一种属性，当元素拥有了BFC这个属性的时候，这个元素就可以看作是隔离了的独立容器。容器里面的元素不会在布局上影响到外面的元素。
2024-04-11 14:20:30
565
原创 关于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
732
原创 win11安装wsl报错：无法解析服务器的名称或地址
项目开发中，需要用到wsl，因此根据wsl官方（）命令进行wsl的安装。而本文主要是记录自己在安装wsl中遇到的问题 “” 的解决办法。
2024-04-03 16:37:43
933
原创 关于自己Nginx的使用（ant design pro 部署）
工作需要部署 ant design pro 框架开发的前端程序，并且需要有用到代理。就选择了nginx部署。
2024-03-19 11:57:44
990
原创 关于修改ant design中 transfer 选中条目提示的标题
在项目中使用到了antd transfer（穿梭框）功能，发现自带的选中提示跟项目UI设计不符。
2024-03-18 11:59:07
224
原创 记录一次使用ant design 中 ConfigProvider来修改样式导致样式改变的问题（Tabs嵌套Tabs）
如代码所示，外层Tabs中又包含了一个内层的Tab，因此内层的Tabs样式也会被 ConfigProvider 所影响，导致内层Tab样式跟外层Tab样式一样。要想只改变外部Tabs样式，而内部样式不变的方法，我只知道，通过ConfigProvider还原内部Tabs样式。在修改外层tabs样式时，使用到了antd5中的ConfigProvider，通过token进行样式修改。
2024-02-01 14:28:33
402
原创 获取鼠标点击图片时候的坐标，以及利用html 中的useMap 和area 实现图片固定位置的点击事件
获取鼠标点击图片时候的坐标，以及利用html 中的useMap 和area 实现图片固定位置的点击事件。
2024-01-29 15:00:10
1322
原创 antd5 Tabs 标签头的文本颜色和背景颜色修改
在项目中使用Tabs标签页，由于设计和antd原始样式的差异，需要对标签头部的背景颜色和字体做修改。
2024-01-12 10:41:35
807
原创 搭建react+ant design pro+umi 项目框架
我搭建react+antd+umi这个框架的原始资料主要是来源于而我写这篇文章的本意就是用来记录我用搭建时候的步骤汇总。
2023-12-24 18:48:05
1459
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
1198
原创 mysql 在nodejs中的简单使用（增删改查）
在另外一篇文章还看到下面这种方式，还未验证过。先放到这里（根据这种方式还可以尝试一下另一种批量新增方式）。（1） 新增（insert）一行。另外看到的方式（用这种方式可以尝试一下批量修改）
2023-08-16 18:25:14
532
原创 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
788
原创 关于linux服务器上生成的图片中文字为的乱码问题
（4）执行：fc-cache -fv。自己建一个文件夹（myFont），把想要的字体拖进去，（可以看到拖进去之后可以看到三个文件）。linux服务器后端生成图表（使用了canvas和echarts），并将生成的图片发送到企业微信群里。最后：fc-cache -fv运行成功之后按理说放进去的字体就安装成功了。在本地windows系统下文字中选一个自己想要的文字（我选了微软雅黑）。字体安装之后，重新运行了程序，可以看到图片上已经展示中文了。生成的图表中文展示不出来，是乱码。执行相关命令，安装放进去的字体。
2023-06-16 11:05:20
1397
原创 记录一次使用__dirname和./引出的bug
但是在获取这张图片的时候我使用的是“找了好久都不知道为什么会找不到这张图片。下面是网上查的资料截取的一部分。还是有区别的（我之前以为没区别）。
2023-06-14 18:40:01
1114
原创 因 yarn.lock 引发的事故（对你们来说应该是故事，哭唧唧）
我又进行第二个猜想：提交到git上的代码没有提交全，或者合并代码的时候合并掉了。然后为了对比git上的代码，又就将上传后的代码clone下来，跟我本地源码进行对比。猜怎么着，--------对应的功能代码完全相同-------当时我整个人就郁闷了。突然，就在对比代码的时候发现有一个yarn.lock不一样（之前我没有把yarn.lock上传到git，所以在yarn install 的时候会再生成），然后我在网上查了一下yarn.lock的作用（我是一个小菜鸟）。这证明我代码是没问题的。我感觉我发现问题了。
2023-03-30 11:18:03
986
原创 antdesign踩坑日记-Cascader属性之displayRender
级联选择中想同时使用displayRender和multiple属性时候，ant 最低版本都应该是4.18.0。
2023-02-19 11:01:30
899
原创 ag-grid 表格数据更新
有时候我们会涉及到数据更新，但是又不想刷新整个页面，那么就可以单独对表格中的数据进行更新。以下有三种更新情况：表格整个数据的更新；更新一行数据；更新单元格数据。最初的表格数据如下图：一 更新整个表格的数据 使用setRowData方法。 function resetGrid() { //新的数据项 const Newdata = [ { id: "dd", name: '...
2021-10-27 17:37:57
4902
原创 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
1466
5
原创 ag-grid 表头样式（颜色渲染）
一 整行表头渲染同一个样式： 这种比较简单，直接设置css 样式，现在还缺第二行背景颜色的设置。具体css样式如下： /* 第一行表头的样式 */ .ag-header-group-cell-with-group { background-color: gold; color: red; } /* 第二行表头的字体设置 */ .ag-hea...
2021-09-18 11:55:36
3355
原创 ag-grid 设置行高
ag-gird 表格原生行高实在太宽,现在需要将行高缩小一点.以下将对表格的两种情况进行设置:1.普通表格数据展示(无分组情况) 效果如图所示:设置步骤: (1) .rowHeight:设置数据行行高;headerHeight设置表格表头行高, rowHeight: 28, // 设置表格行高 headerHeight: 30, // 设置表格表头的行高 (2).在defaultColDef中设置cellStyle.的line-height....
2021-09-13 20:42:17
3064
原创 Echarts-折线图-设置线条颜色以及线条以下区域显示渐变颜色
首先，先看折线图效果。1.设置线条颜色： 在series中，数组项设置lineStyle属性。 lineStyle: { // 设置线条的style等 normal: { color: 'red', // 折线线条颜色:红色 }, },2.设置线条上点的颜色（也是图例的颜色）在series中，使用itemStyle属性。 ...
2021-09-10 10:33:50
22677
4
原创 ag-grid 自适应大小
ag-grid 表格需要自适应浏览器窗口大小，以下为没有自适应的情况：以下为已经自适应的情况：如果需要自适应，统一调用api：sizeColumnsToFit()即可，只不过调用的触发事件不同。 分别有以下三种情况出现：情况1：表格初始化完毕后自适应浏览器大小。触发事件：ag-grid中的onGridReady事件：在表格ok后调用，适应浏览器大小。情况2：当浏览器页面大小没变，但是表格大小有变化时，也重绘至自适应浏览器大小。触发事件：ag-grid中的onGri...
2021-09-03 14:15:30
4333
原创 ag-grid 单元格编辑-下拉框
一、基本下拉框 效果如下：选中后的值直接就是界面显示的值（也是代码中定义的值）。效果如下：二、有id 的下拉框 这个下拉框跟平常用的select 框类似，设置id和value，在界面选择的时候显示的是value值，但是选中值后，后台获取到的被选中值是value对应的id值。具体效果如下：以上两个例子的代码如下：<!doctype html><html><head> <met...
2021-08-27 18:17:58
3940
5
原创 ag-grid 合并单元格（合并行）
最终效果如图：页面完整代码如下：<!doctype html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>合并单元格行</title> <script .
2021-08-27 17:10:59
5475
7
原创 layui 中tab控件点击切换触发事件
在layui中使用到tab控件，如果不想在页面加载时就加载所有tab的界面，而是点击某个tab再加载对应的数据，可以使用tab 的点击事件。方法一： 这个方法是我最初在网上找的使用方法。非IE浏览器//切换tab 调用不同的方法layui.use('element', function(){ var $ = jQuery = layui.jquery; var element = layui.element; $('.layui-...
2021-08-11 18:16:19
4983
1
原创 ag-grid 设置单元格以及行的颜色
在使用ag-grid的时候有通过单元格的值设置不同行颜色，然后百度了网上的方法，汇总了一下，具体效果图如下： 话不多说，直接上代码。<!doctype html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink...
2020-06-11 15:14:28
7184
1
原创 ag-grid 列组和行组学习
首先，话不多说，直接上效果图。 代码如下：<!doctype html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=...
2020-06-11 11:43:13
3262
原创 ag-grid 学习笔记五：ag-grid事件（onRowClicked行点击事件、onCellClicked单击单元格事件、onCellDoubleClicked双击单元格事件、全部事件列表）
一onRowClicked行点击事件 此事件发生在点击表格行的时候，事件写在gridOptions下。 onRowClicked: function (event) { //event.data 选中的行内数据，event.event 为鼠标事件，等其他。可以log自己看一下 console.log('a row was clicked', event); var itxst = JSON....
2020-06-10 20:42:15
6910
原创 ag-grid 学习笔记四：ag-grid方法（重设行数据、增删改、反选、新增列、插入新行、合计行接口、遍历行对象、获取置顶行数量、获取底部合计行对象、获取行对象、刷新、单元格焦点）
一 setRowData重新设置表格行数据 重新设置表格数据很简单，只需要调用 gridOptions.api.setRowData(数据集)接口传入数据即可。 以下函数为调用方式。function resetGrid() { //新的数据项 var Newdata = [ { name: '小明', sex: '男', age: '100', 'jg': '中国', 'sf': '浙江...
2020-06-10 20:06:43
12204
原创 ag-grid 学习笔记三：ag-grid设置（定义列、选择行、复选框、设置行高列宽、置顶合计行、底部合计行、行组、客户端排序）
目录一 定义列二 选择行三 设置复选框四 设置行高列宽五 置顶合计行六 底部合计行七 行组八 客户端排序一 定义列表格的列有如下常用属性。名称 说明 headerName 显示的列名称，和数据没有关系显示给用户看的 field 字段，headerName对于的数据字段，如上面代码“姓名”列对应的数据字段是name pinned 列固定（冻结列）的位置，，支持left right,把列固定在左边或者右边 valueFormat
2020-06-09 16:32:02
12092
1
原创 ag-grid 学习笔记二：常用功能（多表头、固定列、宽度设置和位置、数据筛选器、表格编辑）
目录一 多表头二 固定列三 拖动改变列的宽度和位置四 数据筛选器五 编辑表格六 所有代码一 多表头1.合并两层表头 合并表头，在第一层表头下加children子项即可。例如： //定义表格列 var columnDefs = [ { headerName: '分组A', children: [ { he...
2020-06-09 15:44:31
11723
原创 ag-grid 学习笔记一：使用ag-grid显示简单数据
我的第一个前端项目就用到了ag-grid。写这篇文章用来记录学习到的东西。一 导入ag-grid-enterprise.min.js文件的方式。导入方式有两种： 方式一：使用<script>标签添加。前提是已经将文件放到了此项目相关文件夹中。<script type="text/javascript" src="../js/ag-grid-enterprise.min.js"></script> 方式二 ：通过链接添加，这个就不需要...
2020-06-09 11:42:52
3611
1
原创 EChart 学习笔记三：饼图以及环形图
饼图不像是柱状图，饼图不需要X、Y轴的数据，这个只是一维数据。直接上效果图： 具体代码如下：<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>饼图以及环形图示例</title> <!-- 引入 echarts.js --> &l...
2020-06-08 21:00:39
688
原创 EChart 学习笔记二：EChart 相关语法以及属性
常用属性在代码中可见。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>第一个 ECharts 实例</title> <!--步骤一： 引入 echarts.js 文件--> <script src="../EChart/echarts.js"></script></head>
2020-06-08 20:15:55
507
原创 EChart 学习笔记一：EChart在html中的使用方式。
做项目的时候有用到，现在做一些笔记来记录，以免长时间没使用便给忘记。本人前端新手，如果其中内容有误，还请多指教，感激不尽！EChart 在HTML中有两种使用方式，一种是使用<script>标签引入,一种是使用CDN（内容分发网络）方法，还有一种是npm安装方法一使用<script>标签引入 使用<script>标签引入前需要下载echarts.min.js 文件，并包含在项目中。如果没有echarts.min.js文件，可以通过以下链接，可以去定...
2020-06-08 18:52:28
4198
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关注的人