- 博客(19)
- 收藏
- 关注
RSS订阅原创 使用CRA搭建基于 TypeScript 的 React项目
（Mock Service Worker） 更适合前端模拟真实 API 请求，甚至可以拦截 fetch、XMLHttpRequest 请求。组件拆分为几个小组件所以是创建文件夹形式，一般情况下创建。大体框架就完成了，后续可根据自己的需求进行修改。默认 antd 会加载所有组件，但可以使用。使用MSW模拟登录接口返回token，存入。进行 按需加载，减少打包体积。来判断用户是否登录。
2025-04-01 15:43:40
912
原创 CSS Grid 布局：属性及使用详解
CSS Grid 布局是现代网页设计中的重要工具，它允许开发者创建复杂的布局结构，且不需要借助浮动或复杂的定位技巧。Grid 布局的核心在于将页面区域分成“行”和“列”，并通过指定项的跨度与位置来控制布局。理解 CSS Grid 的基础概念和属性是掌握这一布局方法的第一步。
2024-12-18 15:33:02
1293
原创 react中实现导出excel文件
在使用 xlsx 时，如果需要自定义列标题，可以通过手动创建数据表头，然后将其与数据合并为新的数组，最后生成工作表。// 用于操作 Excel 文件// 用于保存文件// 示例数据// 自定义列标题// 数据按自定义顺序排序// 将列标题与数据合并// 创建工作表// 创建工作簿并添加工作表// 导出为 Blob// 使用 FileSaver 保存文件return (
2024-12-18 09:40:18
1431
原创 react创建简单甘特图 --- Dhtmlx Gantt教程
是一个功能强大的 JavaScript 甘特图库，用于构建交互式项目管理应用程序。它提供丰富的功能，包括任务管理、依赖关系管理、资源分配、进度跟踪以及多种可视化选项。允许用户创建、编辑和管理项目任务，定义任务之间的依赖关系，分配资源，并可视化项目进度。它还支持多种导出格式，例如 PDF 和 PNG，以及与其他项目管理工具的集成。其专业版还提供高级功能，例如资源管理、关键路径计算和基线支持。总而言之，是一个全面的甘特图解决方案，适用于各种项目管理需求。
2024-12-09 09:44:02
1396
原创 nodejs+express+mysql创建简单项目后台
打开migrations文件夹，里面有一个由当前时间，加上create-user命名的文件，这个文件就是迁移文件。作用是用来创建、修改表的。这张表里记录了当前已经跑过了哪些迁移，这样当再次运行sequelize db:migrate时，已经运行过的迁移文件，就不会重复再次执行了。在项目根目录新建docker-compose.yml文件，名称是固定的，然后将下面的配置复制进去，这就是MySQL的一个简单配置。之后的其他接口创建流程和前面所述的一样，就不再多做赘述，至此一个简单项目的后台就创建完成。
2024-09-12 01:07:35
1264
原创 使用nrm快速切换下载镜像
nrm(npm registry manager)，即npm的镜像源管理工具。它的作用是允许用户在各个不同的npm源之间来回切换，以便从不同的服务器下载npm资源。。
2024-08-07 16:01:49
372
1
原创 React实现后台管理系统（二）
使用antd中的Tag组件实现，在components文件夹下新建tag/index.js以及index.css文件。使用mock模拟登录接口返回token，存入localStorage来判断用户是否登录。
2024-08-01 18:54:14
1651
3
原创 React实现后台管理系统（一）
在src/utils文件夹下新建mock.js文件用于编写mock请求拦截及接口数据模拟，并在根目录下的index.js文件（入口文件）中引入mock.js文件（菜单展开收起状态其实只需要组件间传值就能简单实现，只是此处用此作为例子实现redux，原始使用传值实现的方式此处我也做了保留。使用antd中的Grid栅格组件进行布局，然后使用Card组件实现首页用户Card的内容展示。在src文件下新建utils/request.js文件用于封装axios。
2024-07-24 18:46:58
3359
7
原创 react脚手架创建项目
在mockData.js中引入mockjs，并写模拟的返回数据，第一个参数是接口，第二个是请求类型，第三个是一个函数，接收请求参数并处理之后返回数据。代码中通过规则模式匹配作代码识别和报告的插件化的检测工具，它的目的是保证代码规范的一致性和及时发现代码问题，提前避免错误发生。冲突情况，记得检查package.json和.eslintrc.js文件内容是否有引入版本不同导致的冲突情况。可以极大的提高项目中多人协作开发时的效率、代码的可读性以及可维护性。命令将配置完全暴露出来，但这是一个不可逆的操作，复杂的。
2024-02-22 23:05:55
2120
原创 onMouseEnter,onMouseLeave,onMouseOver,onMouseOut的区别
onMouseEnter：当鼠标移入指定区域的时候触发，但是不支持冒泡，进入或者离开子组件都不触发。onMouseLeave：当鼠标移出指定区域的时候触发，但是不支持冒泡，进入或者离开子组件都不触发。onMouseEnter：当鼠标移入指定区域的时候触发，支持冒泡，进入或者离开子组件触发。onMouseLeave：当鼠标移出指定区域的时候触发，支持冒泡，进入或者离开子组件触发。
2023-02-17 10:18:16
1092
原创 Threejs实现3d地球记录（5）
在渲染飞线处，渲染波动光圈矩形网格模型，并将得到的波动光圈Mash数组存入WaveMeshArr 中，方便后续在渲染循环中对光圈的波动进行设置。标注的点与飞线段起始点一致，因此可在渲染飞线处，渲染球面标注。
2022-08-24 15:17:13
1828
3
原创 Threejs实现3d地球记录（4）
Three.js基础曲线函数有三种：样条曲线：在三维空间中设置5个顶点，输入三维样条曲线CatmullRomCurve3函数作为参数，然后返回更多个顶点，通过返回的顶点数据，构建一个几何体，然后绘制出来一条沿着5个顶点的光滑样条曲线。三维三次贝赛尔曲线： 由起点、终点、及两个控制点定义，通过三维三次贝塞尔曲线（CubicBezierCurve3）绘制出一条平滑的曲线圆弧曲线：类似于画一个圆，取其中一段作为弧线；将圆心坐标，圆半径，圆弧起始角度作为ArcCurve参数，绘制一段圆弧。
2022-08-20 17:25:07
3093
1
原创 React+Threejs初步学习
一、创建React项目：使用facebook给出的脚手架工具create-react-app：1、npm版本5.2以上：npx create-react-app 项目名2、npm版本5.2以下:npm install create-react-qpp -gcreate-react-app 项目名二、安装需要的库three是Three.js的库npm i three --save三、引入库import React, { Component, useEffect } from 're
2022-03-14 17:04:17
5882
2
原创 position:fixed相对于其他组件定位
position:fixed相对于父级元素定位position:fixed相对于其他组件定位：给想要在此元素定位的组件上加上 transform: scale(1,1) 或者是别的,只要transform 的属性不是none就行
2021-11-17 11:53:48
337
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人