- 博客(29)
- 收藏
- 关注
原创 Next.js 入门了解
用./pages/_app.tsx来自定义应用App,可以配置全局的css,或者getServerSideProps方法来给每个页面添加数据。用./pages/_document.tsx来自定义页面的Document,可以配置页面html,head属性,或者使用静态getInitialProps方法中renderPage方法来包括整个react 应用。
2025-11-17 08:49:20
1058
原创 vue小技巧
想用<script setup>又要name。:组合式里拿 DOM,告别ref(null)编译时直接输出静态 HTML,不需要使用。:列表渲染后项不变,却反复 diff。无需额外<script>块,:父组件只调用子组件特定方法。比computed更轻量,:路由级代码分割,首屏瘦身。:纯展示文本,永不更新。
2025-11-17 07:46:41
429
原创 Spring Boot的web配置进阶
这里之所以继承RuntimeException,是为了方便事务回滚。而自定义异常的好处在于:一方面可以使代码语义化,另一方面使得我们编码更加方便。
2025-11-17 06:37:55
467
原创 Spring Boot的web基础配置
增加一个拦截器,需要通过继承WebMvcConfigurerAdapter然后重写父类中的方法进行扩展。@Override@OverrideSystem.out.println("自定义拦截器。。。");@Override@Override// 添加拦截器并设置拦截规则自定义消息转化器有两种实现方式,一种是@Bean方式,另一种是自定义拦截器。WebMvcConfigurerAdapter的功能很强大,除了可以配置拦截器外,还可以配置消息转换器。@Override。
2025-11-16 23:27:59
342
原创 详解Diff算法
虚拟DOM是一个对象,一个用来表示真实DOM的对象此时如果我们修改一个li标签的文本,生成的新虚拟DOM也会随之改变这种情况就是大家平常说的新旧两个虚拟DOM,这个时候的新虚拟DOM是数据的最新状态虚拟DOM算法操作真实DOM,性能高于直接操作真实DOM。虚拟DOM和虚拟DOM算法是两种概念。虚拟DOM算法=虚拟DOM+Diff算法。在刚刚我们其实只修改了一个li标签文本,其他都是不变的,因此我们没有必要所有的节点都更新,只需要更新这个li标签就行。Diff算法就是查出这个li标签的算法。
2025-10-22 14:37:10
969
原创 详解Promise
Promise是一种为简化异步编程而设计的核心语言特性,它是一个对象,表示异步操作的结果。实际上,Promise就是一个容器,里面保存着某个未来才会结束的事件(通常是异步操作)的结果。
2025-09-03 15:49:25
697
原创 JavaScript考核
解释:Promise.resolve()创建一个状态为resolved的 Promise,接着调用第一个.then()方法返回一个Error对象,在 Promise 链中,返回一个非 Promise 值(包括Error对象)不会触发拒绝(rejection),而是会将这个值传递给下一个.then()方法。解释:先执行同步代码,再调用async1,在async1函数中await后面的剩余代码被包装成微任务放入微任务队列,但由于Promise是pending状态,所以这个微任务暂时不执行。
2025-09-02 21:30:56
414
原创 黑马头条项目详解
步骤:STEP1:在 utils/request.js 配置 axios 请求作用:提取公共前缀地址,配置后 axios 请求时都会 baseURL + urlSTEP2:使用 form-serialize 插件收集手机号和验证码数据STEP3:基于 axios 调用验证码登录接口STEP4:使用 Bootstrap 的 Alert 警告框反馈结果给用户注意:console.dir()打印错误详细信息,重点就是边写代码边打印,对比验证所得到的数据哪些是我们所需要的再复制路径获取信息。
2025-07-24 20:51:28
1191
原创 AJAX案例合集
JS核心代码案例叮嘱:明确核心步骤:STEP1:选择图片上传,设置body背景STEP2:上传成功时,保存url网址STEP3:网页运行后,获取url网址使用1.上传图片资源后对服务器返回的数据进行处理,将其设置为body背景,注意body部分的样式修改不需要先获取元素可以直接修改,顺带将图片网址保存在本地存储中1.获取图片文件对象2.使用 FormData 携带图片文件3.提交表单数据到服务器,使用图片 url 网址2. 网页运行后直接获取图片url网址,但是需要注意只有。
2025-07-23 21:44:24
665
原创 Ajax第一天
1.引入 axios.js:https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js。method:请求的方法,GET可以省略(不区分大小写)表单元素设置name属性,值会作为对象的属性名,建议name属性的值,最好和接口文档参数名一致。2.请求头:以键值对的格式携带的附加信息,比如:Content-Type。2.响应头:以键值对的格式携带的附加信息,比如:Content-Type。接口:使用 AJAX 和服务器通讯时,使用的 URL,请求方法,以及参数。
2025-07-22 21:26:41
1057
原创 Js进阶案例合集
本文展示了三个前端开发案例:1. 商品列表渲染与筛选功能,使用CSS实现响应式布局和悬停效果,通过JavaScript实现商品数据渲染和价格区间筛选;2. 购物车功能实现,包含商品展示、规格处理、赠品模块和小计计算,利用map和reduce方法处理数据;3. 模态框封装案例,采用面向对象方式实现可复用的弹窗组件,包含打开、关闭等基础功能。三个案例均采用现代前端技术实现,涉及CSS布局、DOM操作、数组方法应用等核心知识点,展示了前端开发中常见功能的实现思路。
2025-07-21 21:20:42
720
原创 APIs案例及知识点串讲(下)
CSS代码HTML代码JS代码案例叮嘱:1.首先明确核心思路,我们采取对数组的增加和删除操作,然后根据数组数据渲染界面 ,因此第一步是声明一个空数组,又因为增加和删除操作都需要渲染,所以我们封装一个渲染函数以便使用时调用2.①注意该事件是表单提交事件,而不是点击事件②我们需要阻止表单默认提交事件这种默认行为我们某些情况下需要阻止默认行为的发生,比如阻止链接的跳转和表单域的跳转③用户输入的数据不能为空,所以我们需要进行表单验证。
2025-07-18 21:47:33
681
原创 JS基础知识(下)
我们可以改进下,用户不输入实参,可以给形参默认值,可以默认为 0, 这样程序更严谨。这个默认值只会在缺少实参参数传递时 才会被执行,所以有参数会优先执行传递过来的实参, 否则默认为undefined。运算结果:无论 && 还是 || ,运算结果都是最后被执行的表达式值,一般用在变量赋值。3.此时数组中存放的是字符串但没有关系,本身数据后面要跟px,就相当于字符串拼接。2.学习这种渲染顺序,先渲染盒子开头,再渲染盒子中间,最后渲染盒子结尾。当 || 连接的两侧都为假时,则返回最后一个假值。
2025-07-15 21:16:06
481
原创 JS基础知识(上)
场景: + 运算符可以实现字符串的拼接。口诀:数字相加,字符相连改进:模板字符串`` (反引号)在英文输入模式下按键盘的tab键上方那个键(1左边那个键)内容拼接变量时,用 ${ } 包住变量。
2025-07-14 20:53:13
577
原创 第一次方向考核
在最后一个浮动的子元素后面添加一个额外标签, 添加清除浮动样式.例如<div style=”clear:both”></div>,或者其他标签(如<br/>等)由于父级盒子很多情况下,不方便给高度,但是子盒子浮动又不占有位置,最后父级盒子高度为0时,就会影响下面的标准流盒子。父盒子使用flex布局,左边的子盒子给一个固定的宽度,右边的盒子flex:1;flex:1表示子项目占剩余空间的1份,剩余空间就是看子盒子有没有给宽度。为什么要清除浮动,清除浮动的方法有哪些?怎么实现左边宽度固定右边宽度自适应的布局?
2025-06-14 12:51:27
477
原创 CSS高级技巧
一个网页中往往会应用很多小的背景图像作为修饰,当网页中的图像过多时,服务器就会频繁地接收和发送请求图片,造成服务器请求压力过大,这将大大降低页面的加载速度。因此,为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度,出现了CSS精灵技术(也称CSS Sprites、CSS雪碧)核心原理:将网页中的一些小背景图像整合到一张大图中,这样服务器只需要一次请求就可以了。精灵技术目的:为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度。
2025-06-08 15:39:10
938
原创 浮动&定位
1.某个元素可以自由的在一个盒子内移动位置,并且压住其他盒子.2.当我们滚动窗口的时候,盒子是固定屏幕某个位置的。以上效果,标准流或浮动都无法快速实现,此时需要定位来实现。所以:1.浮动可以让多个块级盒子一行没有缝隙排列显示,经常用于横向排列盒子。2.定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置,并且可以压住其他盒子。在使用定位布局时,可能会出现盒子重叠的情况。此时,可以使用z-index来控制盒子的前后次序(z轴)
2025-05-25 11:02:15
961
原创 盒子模型重点
一.网页布局本质一.网页布局本质网页布局过程:1. 先准备好相关的网页元素,网页元素基本都是盒子Box。2. 利用CSS设置好盒子样式,然后摆放到相应位置。3. 往盒子里面装内容.网页布局的核心本质:就是利用CSS 摆盒子。
2025-05-18 11:12:36
1648
原创 HTML大总结
主要包括结构表现(Presentation)和行为(Behavior)三个方面Web 标准提出的最佳体验方案:结构、样式、行为相分离简单理解:结构写到HTML 文件中,表现写到CSS 文件中,行为写到JavaScript 文件中自定义列表的使用场景:自定义列表常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何项目符号。在HTML 标签中,<dl>标签用于定义描述列表(或定义列表),该标签会与<dt>(定义项目/名字)和<dd>(描述每一个项目/名字)一起使用。
2025-05-11 17:35:17
1379
原创 阶段总结I
给定一个已排序的链表的头head删除原始链表中所有重复数字的节点,只留下不同的数字。返回已排序的链表。[1,2,5][2,3][0, 300]由于给定的链表是排好序的,因此,我们只需要一次遍历就可以删除重复元素,由于链表头结点也可能被删所以需要引入虚拟头结点。注意链表为空需要特判。如果当前 cur->next 与 cur->next->next 对应的元素相同(不过前提是它俩不能为空结点),那么我们就需要将 cur->next 以及所有后面拥有相同元素值的链表结点全部删除。
2025-05-05 16:13:20
1009
原创 4.22每日算法--【链表最终章】
当我们将结点1进行反向操作之后,我们需要继续移动cur指针和pre指针,那么问题来了此时我们移动cur指针时(如下图),目标结点2的地址已经获取不到了,因为此时没有任何指针指向结点2 ,所以我们应该。在进行反转链表的操作时如果再定义一个新的链表实现会对内存空间产生极大的浪费,其实我们只需要改变链表next指针的指向就可以实现反转功能了(注:下图摘自代码随想录)·如果两个链表都不为空,则比较两个链表当前结点的值,并选择较小的结点作为新链表的当前结点(因为题目明确要求需要新链表严格升序排列)
2025-04-22 18:05:20
1185
原创 4.19 每日算法--【链表中的双指针专题】
那么我们此时总结普遍情况下,控制快慢指针移动的循环条件,最开始我认为既然是两种情况分别得到的条件,应该是||的关系,但如果是||的关系的话,那么当fast=NULL时再去访问fast->next程序就崩了,所以正确的应该是fast!那么问题来了,我们都知道由于单链表的特殊性,我们想要删除一个结点一定要先知道它的上一个结点才能对它进行操作,所以我们的操作指针一定要指向需要删除的结点的上一个结点,于是我们决定,就让慢指针指向这个位置。这道题也是运用的双指针算法,这道题的思路也是不好想的,虽然是力扣上的简单题。
2025-04-19 17:09:50
961
原创 ddd的代码随记(1)
给你一个按照非递减顺序排列的整数数组nums,和一个目标值target。请你找出给定目标值在数组中的开始位置和结束位置。如果数组中不存在目标值target,返回[-1, -1]。你必须设计并实现时间复杂度为O(log n)的算法解决此问题。示例 1:[3,4]示例 2:[-1,-1]示例 3:[-1,-1]nums是一个非递减数组a[0]=-1;a[1]=-1;r=mid-1;//重点l=0;
2025-04-13 15:57:04
632
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅
1