- 博客(386)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 [Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example becaus
[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted 如何解决 使用css3 touch-action: non...
2018-09-02 10:41:25
47079
24
原创 关于移动端布局不兼容ipad和ipad pro 解决方法
关于移动端布局不兼容ipad和ipad pro 解决方法 我用移动端布局使用的是淘宝的flex.js来兼容不同的手机屏幕，但是我发现他是不兼容ipad的。于是我通过百度找到了解决办法/(iPhone|iPad|iPhone OS|Phone|iPod|iOS)/i.test(navigator.userAgent)&&(head=document.getElementsByT......
2018-08-03 15:33:02
15531
5
原创 vue登录注册组件源码（注释）
vue登录注册组件源码（注释）此组件，简单实现了防短信轰炸，样式我使用了一些Bootstarp的表单样式 注册<template> <div class="warp"> <div class="main"> <div class="h
2018-07-12 09:36:59
11428
3
原创 第五章：灵网布局秘术的探索
林风凭借对 JavaScript 灵能的深入掌握，将 “灵网幻域” 打造得精彩纷呈，在灵网世界中声名鹊起。然而，林风心中清楚，灵网世界的修行之路漫长且无尽，自己不过是迈出了阶段性的几步。一日，黑袍人再度现身，目光中带着期许与神秘。“林风，你在 JavaScript 灵能的运用上已颇有心得，可灵网页面的构建，布局亦是关键。接下来，我将指引你探索灵网布局秘术，此乃让页面元素排列有序、发挥最大效能的法门。” 黑袍人言罢，手中出现一块散发着古朴气息的玉简，玉简之上符文闪烁，隐隐透露着强大的灵能波动。林风双手接过
2025-04-04 09:00:00
242
原创 解释 React 中React.forwardRef的用途，在组件间传递ref时如何使用它？
就像是一个神奇的小纸条，它可以让你直接接触到组件或者 DOM 元素，能对它们进行一些直接操作，像获取元素的尺寸、调用组件的方法等。这在你不希望直接将 DOM 节点的所有属性和方法暴露给父组件时非常有用，你可以有选择地暴露特定的方法或属性。这就好比你在一个公司里，大老板想直接找最基层的员工了解情况，中间隔了好多层领导，不太容易直接联系上。但有时候会遇到这么个问题，在多层嵌套的组件里，最外层的组件想拿到最内层组件的。在组件间的传递，让外层组件能直接操作内层组件。的传递，你可以依据具体的需求来选择合适的方法。
2025-04-03 20:16:26
711
原创 如何在 Vue 项目中实现一个可拖拽的组件，需要考虑哪些技术要点和交互细节？
虚拟列表只渲染当前可见区域的元素，当滚动或拖动时，动态更新渲染的元素，从而减少 DOM 元素的数量，提升性能。虚拟列表只渲染当前可见区域的元素，当滚动或拖动时，动态更新渲染的元素，从而减少 DOM 元素的数量，提升性能。在拖动过程中，如果有一些计算结果是不变的或者需要多次使用的，可以将其缓存起来，避免重复计算。在拖动过程中，如果有一些计算结果是不变的或者需要多次使用的，可以将其缓存起来，避免重复计算。综上所述，这些函数相互配合，实现了组件的可拖拽功能，同时通过节流处理优化了拖动过程中的性能。
2025-04-03 20:06:10
575
原创 JavaScrip实现一个函数，计算数组中所有元素的乘积的设计思路，以及实现这个函数的多种方法。
要计算数组中所有元素的乘积，我们的目标就是遍历数组中的每一个元素，然后把它们依次乘起来。可以想象成你有一堆数字，就像一堆积木，你要把它们一块一块地垒起来，最后得到的那个“积木塔”的高度就是所有元素的乘积。在实际使用时，你要保证传入函数的数组元素都是有效的数值，不然可能会得到错误的结果。分析这些结果，观察函数的执行时间随数据规模的变化趋势，判断函数的时间复杂度和性能瓶颈。综上所述，通过选择合适的测试工具、生成不同规模的测试数据、多次运行测试和分析测试结果，可以全面、准确地测试计算数组元素乘积的函数的性能。
2025-04-03 19:54:55
345
原创 如何利用 CSS 的mask - image属性实现元素的遮罩效果，有哪些应用场景？
简单来说，就是你能通过一张图或者一个渐变啥的，让元素的某些部分显示，某些部分隐藏，就像给元素戴了个“面具”一样。白色的部分图片会正常显示，透明的部分图片就会被隐藏，这样就形成了一个圆形的显示区域。在这个示例中，我们使用SVG路径创建了一个圆形的遮罩图像，并将其应用到图片上，使图片呈现出圆形的效果。就像上面的例子，你可以用不同的渐变或者图片作为遮罩，给图片搞出各种炫酷的效果。在不同的屏幕尺寸下，你可以用不同的遮罩来适配。在这个例子中，我们使用线性渐变创建了一个矩形遮罩，让图片只有中间部分显示，上下部分隐藏。
2025-04-03 19:43:14
357
原创 ＜wbr＞标签与＜br＞标签的区别，在不同场景下如何选择使用？
简单页面：在简单页面里，无论是使用<br>标签还是<wbr>标签，性能差异都不明显，因为页面内容和布局都比较简单，浏览器的计算量不大。复杂页面：在包含大量文本和动态内容的复杂页面中，频繁使用<wbr>标签可能会对性能产生一定的影响。因为浏览器需要不断地进行计算和判断，以确定是否要在<wbr>标签处换行。而<br>标签由于其强制换行的特性，不会增加额外的计算负担，性能相对更稳定。总的来说，在性能方面，<br>标签相对更稳定，不会带来额外的计算负担；而<wbr>
2025-04-03 19:37:26
400
原创 第四章：初窥 JavaScript 灵能
第四章：初窥 JavaScript 灵能林风在灵网赛事中凭借对 HTML 灵诀和 CSS 灵术的精妙运用崭露头角后，声名在灵网世界的一隅渐渐传开。然而，林风深知自己在灵网修行之路上不过是刚起步，还有诸多强大的灵能等待他去探索。这一日，黑袍人再次找到林风，神色中带着几分期许。“林风，你在之前的表现可圈可点。但灵网世界博大精深，你现有的能力只是冰山一角。接下来，我将引导你接触 JavaScript 灵能，这是赋予灵网页面灵动生机与交互能力的关键所在。” 黑袍人说着，手中出现一本散发着微光的古籍，封面上刻着 “
2025-04-03 08:00:00
428
原创 如何在 React 项目中使用useContext Hook 来共享数据，与 Context API 有什么关系？
Context API 负责创建那个公共仓库（也就是 Context）和管理数据的提供（用 Provider），而。综上所述，如果你需要管理简单的全局状态，Context API是一个轻量级的解决方案；而对于复杂的状态管理和大型应用，Redux则能提供更强大的功能和更好的可维护性。在 React 项目里，你可以同时使用 Context API 和 Redux 进行状态管理，以此充分发挥二者的优势。通过这种方式，你就能在 React 项目中同时运用 Context API 和 Redux 进行状态管理了。
2025-04-02 20:06:19
569
原创 在 Vue 项目中使用Vue.mixin进行全局混入，有哪些注意事项？
作用不同Vue.mixin用于全局注入通用逻辑，影响所有组件；Vue.extend用于创建可复用的组件构造器，可在局部使用。使用方式不同Vue.mixin是全局调用，应用混入对象；Vue.extend是创建构造器，再用构造器创建实例。影响范围不同Vue.mixin是全局影响，所有组件都会受影响；Vue.extend是局部影响，仅在使用构造器创建实例的地方起作用。除了Vue.mixin和Vue.extend，Vue还有哪些常用的工具？在 Vue 中，除了Vue.mixin和Vue.extend。
2025-04-02 19:59:09
581
原创 JavaScript 中Object.seal()方法的作用，它与Object.freeze()有何不同？
例如，在一个表单验证模块中，有一个配置对象存储了验证规则，你不希望在后续的代码中意外添加或删除规则，但可能需要根据不同的情况调整已有规则的值。当你希望一个对象的属性结构保持稳定，不希望在后续的代码中意外添加或删除属性，但又需要保留修改已有属性值的灵活性时，可以使用。方法的作用是封闭一个对象，这意味着你不能给这个对象添加新的属性，也不能删除已有的属性，不过你可以修改对象已有属性的值。方法的作用是冻结一个对象，这意味着你既不能给这个对象添加新的属性，也不能删除已有的属性，并且不能修改对象已有属性的值。
2025-04-02 19:54:15
544
原创 CSS 中overscroll - behavior属性的用途，如何利用它控制滚动行为？
属性，我们可以更好地控制页面中元素的滚动体验，避免一些不必要的默认行为，让用户在浏览页面时感觉更加流畅和舒适。不过，结合其他CSS属性，你可以实现平滑滚动的同时控制滚动边界的行为。你可以把它想象成给元素的滚动设置了一些规则，让滚动变得更符合我们想要的效果。属性类似的效果，主要是通过监听滚动事件，在元素滚动到边界时阻止默认的滚动行为。通过这种方式，你可以创建一个具有平滑滚动效果的页面，同时控制滚动边界的行为。当子元素滚动到边界时，阻止滚动事件冒泡到父元素，避免父元素跟着滚动。属性来控制滚动到边界时的行为。
2025-04-02 19:49:26
194
原创 如何使用＜time＞标签来标记日期和时间，有哪些属性可以设置？
这些废弃属性在现代 HTML 开发中不建议使用，使用 CSS 和 JavaScript 可以更好地实现这些属性原本的功能，同时也能保证代码的可维护性和兼容性。属性的值“2025 - 04 - 10T14:30”是符合 ISO 8601 标准的日期和时间格式，这样机器就能正确解析这个时间。在 HTML 的发展历程中，随着技术的进步和标准的更新，有不少属性已经被废弃，下面为你介绍一些常见的已废弃属性。标签的基本用法很简单，就把要标记的日期或时间写在标签中间就行。属性，它能标记这个时间是文章的发布时间。
2025-04-02 19:41:00
376
原创 第三章：CSS 灵术启蒙
林风怀揣着紧张与期待，跟随黑袍人踏入了灵网世界的核心区域。眼前的景象令他目瞪口呆，五彩斑斓的灵网之光交织闪烁，形态各异的灵网建筑悬浮在空中，散发着神秘而强大的气息。街道上，灵能四溢，众多灵网修行者或行色匆匆，或围聚一处探讨灵诀，这一切都与清平镇的宁静截然不同，充满了奇幻与活力。黑袍人带着林风来到一座古朴的楼阁前，楼阁大门紧闭，门上刻满了复杂的符文。黑袍人抬手在符文上轻轻一抹，大门缓缓开启，一股古老而神秘的气息扑面而来。“这里是灵网知识的宝库，你将在此学习 CSS 灵术。” 黑袍人说道，声音在空旷的楼阁中回
2025-04-02 07:45:00
491
原创 谈谈 React 中Portal的作用，在什么场景下使用它实现跨层级 DOM 渲染？
在 React 里，组件渲染的元素默认会在组件的 DOM 层级里出现。不过有时候，我们可能希望把元素渲染到当前组件层级之外的地方，这时候 React Portal 就能派上用场啦。Portal 就像是一个“传送门”，能让你把组件里的元素“传送到”其他 DOM 节点下面去渲染，即便这些 DOM 节点不在当前组件的 DOM 层级里。React Portal 通过方法打破了组件渲染受限于父组件 DOM 层级的规则，允许将组件内容渲染到任意 DOM 节点。
2025-04-01 18:56:28
1110
原创 Vue 中$attrs和$listeners的用途，在组件间通信中如何使用它们？
attrs能帮你把父组件传给子组件但子组件没用到的属性传递给子组件里的子组件。$listeners能帮你把父组件给子组件绑定的事件传递给子组件里的子组件。通过这俩小助手，你就能更方便地实现组件间的通信啦。在Vue中，$attrs和props有什么区别？在 Vue 里，$attrs和props都和组件间传递数据有关，但它们存在不少区别，下面我就详细说说。props是组件明确要接收和使用的属性，需要提前声明，是组件使用数据的“正式途径”。$attrs是存放未在props。
2025-04-01 18:51:05
542
原创 JavaScrip实现一个函数，将一个数字数组按照奇偶性分成两个数组。
这个函数的作用是接收一个数字数组，然后把数组里的奇数和偶数分别放到不同的数组中，最后返回包含这两个数组的一个新数组。如果要设计一个通用的分割函数，可将分割规则作为参数传入函数，这样就能根据不同的规则灵活分割数组。函数接收一个数组和一个除数作为参数，会把能被该除数整除的元素放到。如果数组包含不同类型的元素，可以按照元素类型来分割。指定一个除数，按数组元素能否被该数整除来分割数组。可以将数组中的正数和负数分别划分到不同的数组中。函数的返回值将元素分类到不同的组中，最后返回所有组的数组。中，其他类型的元素放到。
2025-04-01 18:43:36
586
原创 解释 CSS 中will - change属性的作用，如何正确使用它提升性能？
在深入了解的原理之前，有必要先了解一下浏览器的基本渲染流程。通常，浏览器渲染页面要经历多个阶段，包括解析HTML和CSS构建DOM树与CSSOM树，将二者合并成渲染树，计算每个元素的布局信息（布局阶段），确定元素在屏幕上的具体位置和大小，最后将元素绘制到屏幕上（绘制阶段）。当元素的某些属性发生变化时，浏览器可能需要重新执行这些步骤中的一部分，甚至全部，这会消耗大量资源。
2025-04-01 18:38:14
729
原创 讲讲＜bdi＞标签的作用，在处理双向文本时如何应用？
标签的作用就是把特定的文本隔离出来，让浏览器按照这个文本自身的书写方向去显示，不会被周围其他文本的书写方向影响。电商平台的商品评论区可能会有来自不同国家和地区用户的评论，评论中或许会包含不同书写方向的文本。在CMS里，用户会发布不同语言的文章，文章标题、作者名等元素可能使用不同书写方向的语言。论坛系统里有不同语言的帖子和回复，用户名、帖子标题和内容可能使用不同书写方向的语言。在社交平台上，用户来自世界各地，他们的用户名可能使用不同书写方向的语言。标签，你就能保证不同书写方向的文本在网页上都能正确显示。
2025-04-01 18:32:41
600
原创 第二章：HTML 灵诀初成
墙壁上摆放的精美手工艺品，是父母多年的心血，如今在林风眼中，都化作了灵网页面中的灵动元素。他迅速拿起纸笔，开始勾勒草图，从店铺招牌的醒目位置，到商品展示区的合理划分，每一处细节都经过深思熟虑，力求在灵网世界中完美复刻店铺的魅力。那些复杂的标签符文，此刻在他眼中宛如跳动的精灵，虽充满挑战，却也散发着无尽的诱惑。经过长时间的思索与准备，林风深吸一口气，宛如即将踏上战场的勇士，毅然开始了灵诀的施展。每日破晓，晨曦尚未完全驱散清平镇的薄雾，林风已端坐在窗前，那本古籍在案几上摊开，散发着陈旧却迷人的气息。
2025-04-01 07:45:00
874
原创 如何在 React 中使用useReducer Hook 来管理复杂状态，与useState有何区别？
useReducer的核心原理就是通过reducer函数来集中管理状态的更新逻辑。它将状态更新的逻辑从组件中分离出来，使得代码更易于维护和测试。当你需要处理复杂的状态更新逻辑时，useReducer是一个很好的选择。在实际项目中，如何选择使用useState还是useReducer？在实际项目里，选择使用useState还是useReducer，要依据状态管理的复杂程度、状态更新逻辑以及代码的可维护性等方面来决定。下面从不同角度详细分析，帮你判断何时用useState，何时用useReducer。
2025-03-31 19:32:56
571
原创 Vue 中v - model指令的原理，如何在自定义组件中实现类似v - model的双向绑定功能？
-- 使用v-model将自定义输入框组件和parentMessage数据绑定 -->-- 显示parentMessage数据 --><p>父组件中的消息: {{ parentMessage }}</p>
2025-03-31 19:22:03
1178
原创 如何在 JavaScript 中使用Object.freeze()方法，它对对象的属性有什么影响？
方法是判断对象是否被冻结的有效工具。它会综合考量对象自身属性以及原型的冻结状态。你可以在实际开发中借助这个方法，确保对象处于你期望的状态。除了使用Object.isFrozen()方法，还有其他方式判断对象是否被冻结吗？除了使用方法，还可以通过手动检查对象的属性特性来判断对象是否被冻结。对象的属性不可写：即不能修改属性的值。对象不能添加新属性。对象不能删除已有属性。对象的属性描述符是不可配置的：意味着不能修改属性的配置，如writableenumerable和。
2025-03-31 19:11:07
621
原创 CSS 中mix - blend - mode属性的作用，如何利用它实现元素间的混合效果？
此模式会降低底层颜色的对比度，使上层颜色更明显地显示出来，能产生非常明亮的效果，就像在底层颜色上涂抹了一层高亮的颜色。常用于需要突出上层颜色，让画面变亮的场景。只保留上层元素的色相，饱和度和亮度采用底层元素的，从而混合出一种新的颜色。会增加底层颜色的对比度，使上层颜色更深地融入底层颜色，产生较暗的效果，常用于强调颜色的深度和厚重感。这种模式会根据上层颜色的亮度对底层颜色进行不同程度的加亮或变暗处理，产生一种柔和的光照效果。相反，它会比较上下层元素的颜色，选择较亮的颜色作为最终显示的颜色，忽略较暗的颜色。
2025-03-31 19:00:21
826
原创 简述＜mark＞标签的用途，在文本标记强调方面有何特点？
mark>标签：着重于视觉上的突出显示，用来标记需要特别关注的文本，通常是在特定上下文中有特殊意义的内容。<strong>标签：着重于语义上的重要性，用于强调文本的重要意义和强烈语气。在实际运用中，要依据具体的语义和设计需求，合理选用这两个标签。
2025-03-31 18:54:21
554
原创 如何在 React 中实现一个受控组件与非受控组件，它们的实现原理、方法、区别、作用和应用场景是什么？
语法方面：React 需手动绑定value属性和onChange事件处理函数，而 Vue 用v-model指令就能实现双向数据绑定，语法更简洁。数据流向：React 是单向数据流，通过事件处理函数更新状态；Vue 的v-model是双向数据绑定，修改表单元素的值会自动更新数据，反之亦然。语法方面：React 使用useRef钩子创建ref对象，而 Vue 直接在模板中使用ref属性，在脚本里通过this.$refs来访问。使用频率。
2025-03-30 19:57:25
1171
1
原创 Vue 中activated和deactivated生命周期钩子在keep - alive组件中的作用。
区别created阶段主要是数据的初始化，此时DOM还未渲染，不能进行DOM操作。mounted阶段DOM已经渲染完成，可以进行DOM操作。使用场景created适合进行数据的初始化，如发送HTTP请求获取数据、初始化全局变量等。mounted适合进行需要操作DOM的初始化工作，如初始化第三方插件、绑定事件监听器等。通过合理使用created和mounted生命周期钩子函数，可以更好地控制组件的初始化过程，提升应用的性能和用户体验。Vue中还有哪些常用的生命周期钩子函数？除了created和。
2025-03-30 19:49:31
668
原创 javascript实现一个函数，检查一个字符串是否为回文（正反读都一样）
可以使用双指针法，从数组的首尾两端开始，逐个比较对应位置的元素，如果所有对应位置的元素都相等，那么该数组就是回文数组；需要注意的是，JavaScript 中的对象通常不适合进行回文判断，因为对象的属性和值的顺序是无序的，没有明确的“正向”和“反向”概念。递归法是通过不断缩小数组的范围来进行判断。每次比较数组的首尾元素，如果相同则去掉首尾元素，对剩余的数组继续进行判断，直到数组为空或者只剩下一个元素。这种方法的核心思路是先将原数组进行反转，然后将反转后的数组与原数组进行对比，如果相同则该数组为回文数组。
2025-03-30 19:43:01
411
原创 如何使用 CSS 实现粘性定位（sticky positioning），其原理和应用场景是什么？
运用实现基本的粘性定位。利用视口单位和媒体查询确保在不同屏幕尺寸下正常显示。考虑浏览器兼容性，使用 JavaScript 进行降级处理。margin : 0;} /* 当屏幕宽度小于 600px 时，调整导航栏样式 */ @media(max-width : 600px) {nav ul {
2025-03-30 19:36:53
907
原创 ＜data＞标签的作用，在关联数据与展示文本时如何使用它？
它主要的用途是把机器可读的数据和给人看的文本关联起来。就是说我们在网页上展示给用户看的文本，可能背后还对应着一些数据，这些数据是给程序或者机器来处理的。打个比方，在一个商品列表页面，我们给用户展示的是商品名称，但是每个商品可能还有一个唯一的商品编号，这个编号是给程序用来处理订单、库存之类的操作的。标签把展示文本和机器可读的数据关联起来了，并且可以用 JavaScript 来处理这些关联的数据。// 获取 <data> 标签里展示给用户看的文本内容。// 获取 <data> 标签里机器可读的数据。
2025-03-30 19:29:19
807
原创 React 中props的不可变性，如何在组件中处理需要修改props的情况？
的不可变性在 React 中对性能优化起着至关重要的作用，通过浅比较、配合优化组件、减少 DOM 操作以及便于新特性的使用等方面，显著提升了应用的性能和响应能力。的不可变性是 React 开发中的一个重要原则，它有助于提高代码的可预测性、性能和可维护性，同时也方便了调试和与其他工具的集成。函数会更新父组件的状态，状态更新后 React 会重新渲染组件，从而让子组件展示新的值。是对象或者数组时，若要更新数据，不要直接修改原始对象或数组，而是创建新的对象或数组。放开，React 就会报错，因为不能直接修改。
2025-03-29 20:10:14
858
1
原创 Vue 中render函数的作用，如何使用它进行更灵活的组件渲染？
在 Vue 里， 函数就像是一个超级魔法师，它能让你以一种特别灵活的方式来创建和渲染组件。平常咱们用 Vue 写组件的时候，大多是用模板语法，也就是在 文件里写 HTML 模板代码。但有时候，这种模板语法可能没办法满足一些复杂的需求，这时候 函数就派上用场啦！ 函数可以直接返回虚拟 DOM（Virtual DOM）节点，你可以在函数里写 JavaScript 代码来动态地创建和修改这些节点，这样就能实现一些用模板语法很难做到的效果，比如根据不同的条件动态生成不同的组件、动态修改组件的属性等等。下面我用一
2025-03-29 20:02:54
712
1
原创 javascript实现一个函数，将字符串中的指定子串全部替换为另一个字符串的原理，以及多种方法实现。
要把字符串里的指定子串全部替换成另一个字符串，核心思路就是找出所有的指定子串，然后用新的字符串把它们替换掉。在JavaScript里，要是你想把字符串里的指定子串都替换成另外一个字符串，有不少方法可以实现。方法是字符串对象的一个内置方法，其用途是将字符串中的指定子串替换成另一个字符串。方法会返回一个新的字符串，该字符串是原字符串经过替换操作后的结果，原字符串本身不会被修改。我们可以先把字符串按照要替换的子串分割成数组，然后再用新的字符串把数组里的元素连接起来。如果你要查找的子串是固定的，也可以直接在。
2025-03-29 19:55:12
672
原创 如何使用 CSS 的backdrop - filter属性实现背景模糊等特效，有哪些兼容性问题？
嘿，朋友！今天咱们来聊聊 CSS 里超酷的 属性，它能让你轻松实现背景模糊等超炫特效。咱们先看看这属性到底是啥，然后说说咋用它，最后再讲讲兼容性的事儿。简单来说， 属性就是用来给元素背后的背景添加视觉效果的，像模糊、高斯模糊、亮度调整这些效果都能实现。这么说吧，就好比你透过磨砂玻璃看东西，玻璃后面的景象就变得模糊起来，这个属性就有类似的效果。咱先看个简单的例子，用它来实现背景模糊。在这个例子里，咱们给 设置了一张背景图片，然后创建了一个 容器。在这个容器的 CSS 样式里，用 实现了背景模糊效果，
2025-03-29 19:49:53
933
原创 如何利用＜ruby＞、＜rt＞、＜rp＞标签实现中文注音或字符注释？
标签内的注释文字颜色就会和页面主体文字颜色不同。在网页里，要是你想给中文加上拼音注释，或者给某些字符添加额外的说明，HTML 里的。/* 设置 <ruby> 标签内注释文字（<rt> 标签）的颜色 */标签内注释文字的颜色和页面主体文字颜色不同，可借助 CSS 对。标签的颜色加以设置。标签内的元素进行样式设置，下面是一些常见的样式设置示例。标签内的注释文字颜色和页面主体文字颜色存在差异。/* 设置 <ruby> 标签内文字的字体 *//* 设置需要注释的文字的样式 *//* 设置拼音注释的样式 */
2025-03-29 19:45:42
919
原创 React 中shouldComponentUpdate生命周期方法的作用，如何利用它优化组件性能？
这个生命周期方法就像是一个“关卡守卫”，它能决定组件是否需要重新渲染。组件重新渲染是个挺费性能的事儿，就好比你每次都要把整个房间重新布置一遍，即便只是有一点点小改动。方法中创建内联函数或对象会导致每次渲染时都创建新的实例，这可能会触发子组件的不必要重新渲染。属性，这样 React 就能更高效地识别哪些元素发生了变化，减少不必要的重新渲染。就可以帮你避免不必要的“重新布置”，只在真正需要的时候才让组件重新渲染。没有变化时进行不必要的重新渲染，从而提高组件的性能。进行浅比较，避免函数组件不必要的重新渲染。
2025-03-28 19:12:43
1122
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人