- 博客(28)
- 收藏
- 关注
原创 React之userEffect的使用
在React组件中,副作用操作是指那些会被影响的其他的组件,而且不能在渲染过程中完成相关操作。其中,常见的副作用就是从API接口中获取数据。可以在函数组件中处理副作用,避免了类组件的复杂性,使代码更符合函数式编程的思想。提供了一种在函数组件中处理副作用的方式,使得函数组件也能处理这些复杂的逻辑。:将副作用操作与组件的渲染逻辑分离,使代码更加清晰和易于维护。可以将副作用逻辑封装在一个函数中,提高代码的复用性。
2025-03-10 17:55:14
493
原创 表格管理---React
功能:用于生成表格的列表配置对象。接收过滤后的数据、更新过滤后的函数、全选状态、更新状态的函数,已勾选行的键数组以及更新该数组的函数作为参数。
2025-03-03 16:34:49
514
原创 拖拽移动(Semi Design)
自定义拖动后的位置处理,该参数设置后,DragMove 组件内部将仅通过参数返回计算后的位置,不做设置,用户按需自行设置新位置。用于设置元素可被拖动改变位置,支持限制拖拽范围,支持自定义触发拖动的元素。判断鼠标移动距离,如果小于5像素则认为是点击事件,切换元素宽度。设置元素的背景色、宽度、高度、定位方式、圆角等样式。在组件顶部渲染一个提示信息,说明蓝色色块的功能。:用于引用容器元素,以便获取容器的尺寸信息。,设置其样式和事件处理函数,并绑定引用。导出组件,以便在其他地方使用。作为容器,设置其样式和引用。
2025-01-26 17:22:40
440
原创 伸缩框的设计(Semi design)
在调整大小开始时显示“开始设置”的提示,结束时显示“设置结束”的提示,同时更新框内的文本内容。:通过按钮控制伸缩框的大小,每次点击按钮,框的宽度和高度各增加 10px。:支持水平和垂直两种布局方向,提供更灵活的布局选择,适应不同的使用场景。:实现了一个复杂的嵌套伸缩框布局,包含多个水平和垂直方向的伸缩区域。:用户可以在不同方向上调整框的大小,且调整过程中有实时反馈。:通过按钮动态调整框的大小,适合需要精确控制尺寸的场景。:实现了一个按比例调整大小的伸缩框,宽度是高度的两倍。
2025-01-25 19:20:50
933
原创 侧边导航(Semi Design)
根据前几次的导航栏设计,从最简单的三行导航栏到后面响应式的导航栏,其实可以在这个的基础上慢慢优化,就可以得到一个日常使用设计的导航栏。设计步骤也和之前的类似。
2025-01-25 16:25:41
656
原创 侧边栏布局和响应式布局的对比(Semi Design)
例如,当屏幕宽度小于某个断点时,侧边栏可以隐藏或折叠,以适应小屏幕设备。它可能在不同屏幕尺寸下保持固定的布局,导致在小屏幕上内容显示不全或布局混乱。组件就是一个典型的侧边栏布局,侧边栏固定在左侧,右侧是 Header、Content 和 Footer。侧边栏布局通常不涉及断点处理,布局是静态的,不会根据屏幕尺寸变化而改变。,无论屏幕尺寸如何变化,侧边栏的宽度都不会改变。属性,侧边栏的显示和隐藏不会根据屏幕尺寸变化。时,侧边栏会自动隐藏,从而适应小屏幕设备。属性设置了断点,当屏幕宽度小于等于。
2025-01-23 17:52:28
782
原创 左/右侧边栏布局(Semi design)
然后右侧布局和左侧布局及其相识,其最大的区别则是 Sider 和Content的先后顺序,当顺序为先是Sider 再是Content的时候,根据代码从上往下执行顺序,所以Sider是第一个,即为在左边展示,而content是第二个,所以在右边展示,那么将这两顺序调换,则会得到右测边布局效果。小结一下:两者的最大区别就是编码时的先后顺序,其他的都是极其相识的,只不过需要注意样式的调整。
2025-01-23 16:51:29
232
原创 使用Layout三行布局(SemiDesign)
可以直接在react搭建完成后的框架里面找到main.jsx中直接引入。5、以上代码的实现流程图。2、引入Layout布局。3、开始实现三行布局。
2025-01-23 16:13:46
280
原创 axios的引入和基本使用
这个方法,来创建一个axios的实例,将配置项配置到实例里,这样,我们就可以不用每次都重复去写配置项了,而是每次请求直接使用这个axios创建的实例就ok。如果如上使用axios,出现一个问题,有一些配置项,会被重复书写的情况,我们可以使用。(对象): 请求的 URL 参数,会被添加到 URL 后面,Get请求参数。(对象): 请求的数据,通常用于 POST 请求的请求体,post请求参数。axios除了直接使用它实例上的方法,还可以通过配置的方式进行使用。(对象): 请求头,可以设置各种头信息,例如。
2024-12-09 22:16:12
1213
1
原创 异步操作,promise、axios
异步操作是指在编程中,某个任务的执行不会立即完成,同时不会阻塞后续代码的执行。创建一个请求id的函数,该函数返回一个promise,该promise在2秒后解决(成功),返回一个数字(也即指定商品列表的id)(提示:2秒后成功解决,请用。创建一个请求商品列表的函数,该函数接受一个id,该promise在3秒后解决(成功),返回一个商品列表,商品列表的数据如下。四、使用finally:不管是成功还是失败,都可以使用.finally():初始状态,既没有成功,也没有失败,也可以叫做等待态。
2024-12-09 21:56:15
635
原创 redis快速进门
NoSql 可以翻译做Not Only Sql(不仅仅是SQL),或者是No Sql(非Sql的)数据库。是相对于传统关系型数据库而言,有很大差异的一种特殊的数据库,因此也称之为非关系型数据库。主流的关系型数据库包括 `Oracle`、`MySQL`、`SQL Server`、`Microsoft Access`、`DB2` 等。- 对于高并发读写的需求,传统关系型数据库节点的硬盘I/O是一个很大的瓶颈。主流的 NoSQL 数据库有 `Redis`、`MongBD`、`Hbase`、`CouhDB` 等。
2024-11-30 21:18:01
657
原创 JavaScript基础知识
变:变化 量:数据, 变量用于存储程序中变化的数据;变量就是让我们告诉计算机我们需要在内存中开辟一块存储空间,用于数据的保存。变量存储在计算机内存的“小格子”中,内存是由 N 多个“小格子”构成,每个“小格子”为它起一个名字然后将数据存放进去。通过这个格子名(变量名)我们就可以操作格子中的数据。声明变量的方法var:函数作用域,声明提升。let:块级作用域,无声明提升。const:块级作用域,无声明提升,常量。var定义var是最早的变量声明方法,支持函数作用域,不支持块级作用域。特点。
2024-11-20 17:03:56
849
原创 软件测试tips
→→测试设计、软件开发→测试执行→测试评估需求测试通常是以软件开发需求为基础的分析,通过对需求的细分化和分解,形成可测试的内容。测试需求因覆盖全部已定义的业务流程,以及功能和非功能方面的需求。是指在进行系统测试的过程中,根据一定的原则和标准对测试对象进行评估,确定是否具备进行系统测试的条件,并根据测试效果进行准出和准入的判断。这些原则主要包括测试计划和策略的明确、测试环境和测试数据的准备、测试案例的准备、测试任务的分配、测试执行和测试报告的编制等方面。
2024-11-20 11:39:38
405
原创 springboot之异常处理
异常分类: 代表编译和系统错误,不允许捕获 标准Java库的方法所激发的异常,包含运行异常Runtime_Exception和非运行异常 Non_RuntimeException 的子类 运行时异常。 非运行时可检测的异常,Java 编译器利用分析方法或构造方法中可能产生的结果来检测程序中是否含有检测异常的处理程序,每个可能的可检测异常、方法或构造方法的 throws 子句必须列出该异常对应的类。 用户自定义异常异常处理用于解决一些程序无法掌控, 但又必须面对的情况。例如,程序需要读取文件、连接网络、使用数
2024-11-19 20:17:50
1031
原创 SpringBoot拦截器
拦截器实现preHandlepostHandle和。创建interceptor包,创建TestInterceptor类/** 1、实现HandlerInterceptor* 步骤:* 1、定义拦截器* 2、注册拦截器* */@Component@OverrideSystem.out.println("执行内容:preHandle1,目标方法执行前");
2024-11-17 17:00:44
789
原创 SpringBoot自定义转换器
在Spring Boot中,*转换器(Converter)*是用于将一种类型的对象转换成另一种类型的组件。Spring提供了多种内置转换器,但你也可以自定义转换器来满足业务需求。转换器通常在数据绑定、数据处理或者DTO(Data Transfer Object)与实体类之间的转换中使用。
2024-11-17 16:34:30
2461
原创 Flex布局
例如:display:flex;3.容器的属性设置和使用以下6个属性设置在容器上。flex-wrapflex-flow3.1 flex-direction属性属性决定主轴的方向(即项目的排列方向)。不光调整顺序,还会调整基准的起点例子:.box {flex-d它可能有4个值。row(默认值):主轴为水平方向,起点在左端。:主轴为水平方向,起点在右端。column:主轴为垂直方向,起点在上沿。:主轴为垂直方向,起点在下沿。3.2 flex-wrap属性。
2024-11-16 17:16:31
2895
原创 盒模型的基础知识
CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型网页中经常会遇到以下属性:内容(content)、填充(padding)、边框(border)、边界(margin), 这些都是CSS盒子具备属性通俗来讲: 这些属性我们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也就是能装东西的一种箱子,也具有这些属性,所以叫它盒子模型。盒子模型特点:每个盒子都有:边界、边框、填充、内容四个属性;并且每个盒子都有尺寸。每个属性都包括四个部分:上、右、下、左;
2024-11-16 16:38:42
1210
原创 SpringBoot参数注解
在Spring Boot中,处理参数传递是开发时的常见任务。Spring Boot提供了多种注解,用于处理不同类型的参数传递。
2024-11-13 20:27:15
1174
原创 HTML基本知识
1、文档流定义:HTML文档流(Document Flow)是指在HTML文档中元素在布局时的自然顺序,是元素排版布局过程中,元素会默认自动从左往右,从上往下的流式排列方式。相对定位的元素仍然占据其在文档流中的原始空间。4、固定定位(Fixed Positioning):通过设置元素的position: fixed,可以将元素固定在视窗的某个位置,即使页面滚动,该元素也不会移动。,,,,:定义表格,:定义行,定义单元格,定义表头。
2024-11-13 20:15:49
2084
原创 springBoot中Lombok的使用方法
Lombok是一个Java类库,其目的是简化POJO实体类 的开发在pom.xml引入或者创建工程时勾选1、在创建工程时勾选2、pom.xml直接引入。
2024-11-12 20:37:37
983
原创 测试是什么
1、测试时,既不能以用户需求为准,也不能以业务需求为准2、但是需要以功能需求为准1、用户需求 :描述的是用户的目标,或用户要求系统必须能完成的任务。用例、场景描述和事件――响应表都是表达用户需求的有效途径。也就是说用户需求描述了用户 能使用系统来做些什么。2、业务需求:表示组织或客户高层次的目标。业务需求通常来自项目投资人、 购买产品的客户、实际用户的管理者、市场营销部门或产品策划部门。业务需求描述了组织为什么要开发一个系统, 即组织希望达到的目标。3、功能需求:应该以业务需求为导向,结合用户需求。
2024-11-11 17:22:09
411
原创 测试的主要步骤
1、让bug只停留在文档上,即尽量在文档上就纠正bug2、需求分析和评审阶段:理解需求的背景和目的、分析需求的范围、分析需求的重点、分析需求的可用性、分析需求的易用性、分析需求流程的完整性。根据这些内容,其目的是解决产品中的遗漏、缺陷和问题,提前发现bug,提前修复,节约成本。
2024-11-11 17:18:41
538
原创 引入配置文件和定义配置文件
Spring Boot免除了项目中大部分的手动配置,对于一些特定情况,可以通过修改全局配置文件以适应具体的开发或生产环境,但是有时候项目中不可避免地要使用默认配置文件之外的配置信息,这个时候就需要手动引入配置文件或配置类Spring Boot项目中引入的配置文件通常有两类,;。一般第一类配置文件可以使用引入,第二类配置文件可以使用引入。使用的是user.properties@PropertySource注解标注在类上,可以指定引入的配置文件的位置和名称。
2024-11-08 23:05:17
1256
原创 **@SpringBootApplication**
这里传入了当前标注了 @SpringBootApplication 的类(即 SpringBoot1Application.class)作为参数,以及命令行参数 args。: 自动扫描指定包下的组件,包括 @Component、@Service、@Repository、@Controller 等,并注册为 Spring 容器中的 Bean。: 启动自动配置,Spring Boot 会根据你添加的依赖自动配置你的应用,比如添加了数据库驱动依赖,就会自动配置数据源和 JPA 等。
2024-11-08 11:20:44
438
原创 spring-boot全局配置文件
可以使用application.properties或者application.yml,属性表达都为key=value的形式出现。1、可以选择的表达方式字面量、数组、集合1.1字面量;单个且不可拆分的值,例如:字符串、数字、Boolean;例子:1.1.1字符串:addres=chongqing #默认情况下,字符串不需要使用单引号或则双引号修饰1.1.2数字:age=181.1.3配置对象(集合):user.addres=chongqing #对象名.属性名=属性值(value)
2024-11-07 20:50:14
951
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人