- 博客(22)
- 收藏
- 关注
RSS订阅原创 react学习笔记-保持组件纯粹
个组件必须是纯粹的，就意味着：--只负责自己的任务。它不会更改在该函数调用前就以存在的对象或变量。--输入相同，则输出相同。给定相同的输入，组件应该总是返回相同的JSX。-渲染随时可能发生，因此组件不应依赖于彼此的渲染顺序。-你不应该改变任何用于组件渲染的输入。这包括props、state和context。通过“设置”state来更新界面，而不改变预先存在的对象。-努力在你返回的JSX中表达你的组件逻辑。当你需要“改变事物”时，你通常希望在事件处理程序中进行。
2025-10-24 08:53:57
958
原创 react学习笔记-渲染列表
<imgperson)}alt={person.name}/><p><b>{person{' ' +person因{person.accomplishment}而闻名世界</p>
2025-10-17 09:00:48
823
原创 react学习笔记-条件渲染
在React，你可以使用JavaScript来控制分支逻辑。你可以使用if语句来选择性地返回JSX表达式。你可以选择性地将一些JSX赋值给变量，然后用大括号将其嵌入到其他JSX中。在JSX中，{cond?<A /> : <B />}表示“当cond为真值时，渲染<A />，否则<B />”。在JSX中，{cond && <A />}表示“当cond为真值时，渲染<A />，否则不进行渲染”。快捷的表达式很常见，但如果你更倾向于使用if，你也可以不使用它们。
2025-10-14 08:56:08
831
原创 react学习笔记-将Props传递给组件
在此示例中，size prop设为40.但是，如果你在新选项卡中打开图片，你会注意到图片本身更大（160像素）。Props可以让你将这样的逻辑封装在Avatar组件中（并在需要时进行更改），以便每个人都可以使用<Avatar>组件，而不必考虑如何请求和调整图像大小。尽管因为在你描述组件特性时用的是JavaScript对象而非JSX属性，使得语法看起来略有不同，但这些示例大多都是等效的，你可以选择任意一种方法。当一个组件需要改变它的props（例如，相应用户交互或新数据）时，它不得不“请求”它的父组件传递。
2025-10-11 08:57:45
338
原创 react学习笔记-在JSX中通过大括号使用JavaScript
因此，为了能在JSX中传递，你必须用另一个对额外的大括号包裹对象：person={{ name: “Hedy Lamarr”, inventions: 5 }}。JSX允许你在JavaScript中编写类似HTML的标签，从而使渲染的逻辑和内容可以写在一起。指定了一个就叫“avatar”的使图片在样式上变圆的CSS类名，而src={avatar}这种写法会去读取JavaScript中avatar这个变量的值。- {{ 和 }} 并不是什么特殊的语法：它只是抱在JSX大括号内的JavaScript对象。
2025-10-07 10:50:02
932
原创 react学习笔记-组件的导入和导出
现在，Gallery.js包含两个导出：一个默认导出的Gallery，另一个是具名导出的Profile。在此示例中，所有组件目前都定义在根组件App.js文件中。如果你使用的框架基于文件进行路由，如Next.js，那你每个页面的根组件都会不一样。当你用默认导入的方式，导入具名导出的组件时，就会报错。通常，文件中仅包含一个组件时，人们会选择默认导出，而当文件中包含多个组件或某个值需要导出时，则会选择具名导出。在你的第一个组件中，你创建了一个Profile组件，并且渲染在Gallery组件里。
2025-10-04 05:45:59
619
原创 rreact学习笔记-你的第一个组件
React允许你讲标签、CSS和JavaScript组合称自定义的“组件”，即应用程序中可复用的UI元素。<article>表示这篇文章，<h1>表示文章的标题，<ol>以有序列表的形式表示表示文章的（缩写的）目录。每一个侧边栏、头像、模态框、下拉框的别后是都是像这样的（结合了用于样式的CSS和用于交互的JavaScript的）标签--你在Webb上看到的每一个UI模块。这意味着你不仅可以将组件用于可复用的部分，例如按钮，还可以用于较大块的部分，例如侧边栏、列表以及最终的完整页面！（非React的特性）。
2025-10-01 03:46:02
573
原创 react学习笔记-React Compiler
你可能已经熟悉了像useMemo、useCallback和React.memo这样的API，通过这些API，你可以告诉React，如果输入没有发生变化，应用程序的某些部分不需要重新计算，从而减少更新时的工作量。在当前的实现中，当组件的状态发生变化时，React将重新渲染该组件及其所有子组件—除非你使用useMemo()、useCallback()或React.memo()应用了某种形式的手动记忆。你可以按照自己的节奏来处理它们，以增加被优化的组件和钩子的数量，但在你可以使用编译器之前并不需要修复所有问题。
2025-09-26 08:51:14
867
原创 react学习笔记-使用TypeScript
TypeScript天然支持JSX—只需在项目中添加@types/react（https://www.npmjs.com/package/@types/react）和@types/react-dom（https://www.npmjs.com/package/@types/react-dom）即可获得完整的React Web支持。当你有一个合理的默认值情况下，这种技术是有效的。函数的类型是根据第一个参数中函数的返回值进行判断的，如果希望明确指定，可以为该Hook提供一个类型参数以指定函数类型。
2025-09-12 08:45:11
667
原创 react学习笔记-编辑器配置
如果你想在合并PR前强制执行文件的格式化，请在你的CI中使用prettier-check（https://prettier.io/docs/cli.html#--check）命令。Text支持JSX和TypeScript，内置语法高亮（https://stackoverflow.com/questions/65555800/how-to-make-sublime-3-open-js-files-with-jsx-syntax/70960574#70960574）和代码自动补全功能。
2025-09-11 08:43:05
264
原创 react学习笔记-将React添加到现有项目中
如果有语法错误，你可能需要使用Babel（https://babeljs.io/setup）转换你的JavaScript代码，并启用Babel React preset（https://babeljs.io/docs/babel-preset-react）来使用JSX。相反，你可能想要在HTML中特定位置渲染React组件。如果遇到困难，请尝试我们的社区资源（https://react.docschina.org/community）或Vite Chate（https://chat.vite.dev/）。
2025-09-10 08:47:19
451
原创 react学习笔记-安装
使用合适的渲染策略针对合适的路由可以减少加载第一个内容字节的时间（首字节时间https://web.dev/articles/ttfb），第一个内容元素渲染的时间（首次内容绘制https://web.dev/articles/fcp），以及应用程序最大可见内容渲染的时间（最大内容绘制。例如，懒加载图表（https://react.docschina.org/reference/react/lazy）会延迟发送渲染图表所需要的代码，将图表代码与应用程序的其余部分分开。React从诞生之初就是被渐进式使用的。
2025-09-09 08:51:50
698
原创 算法-环形链表
给你一个链表的头节点head，判断链表中是否有环。如果链表中有某个节点，可以通过连续跟踪next指针再次到达，则链表中存在环。为了表示给定链表中的环，评测系统内部使用整数pos来表示链表尾连接到链表中的位置（索引从 0 开始）。pos。仅仅是为了标识链表的实际情况。如果链表中存在环，则返回true。否则，返回false。true链表中有一个环，其尾部连接到第二个节点。true链表中有一个环，其尾部连接到第一个节点。false链表中没有环。-1。
2025-07-18 08:21:54
741
原创 算法题-回文链表
给你一个单链表的头节点head，请你判断该链表是否为回文链表。如果是，返回true；否则，返回false。truefalse[1, 105]你能否用O(n)时间复杂度和O(1)空间复杂度解决此题？
2025-07-17 08:10:47
169
原创 算法题-反转链表
给你单链表的头节点head，请你反转链表，并返回反转后的链表。[2,1]head = [][]链表可以选用迭代或递归方式完成反转。你能否用两种方法解决这道题？
2025-07-10 08:56:11
278
原创 算法题-相交链表
题目描述：题目描述：给你两个单链表的头节点headA和headB，请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点，返回null。图示两个链表在节点c1开始相交题目数据保证整个链式结构中不存在环。注意，函数返回结果后，链表必须保持其原始结构。自定义评测：评测系统的输入如下（你设计的程序不适用- 相交的起始节点的值。如果不存在相交节点，这一值为0listA- 第一个链表listB- 第二个链表skipA- 在listA中（从头节点开始）跳到交叉节点的节点数。
2025-07-08 08:46:11
1725
原创 算法题-旋转图像
给定一个n×n的二维矩阵matrix表示一个图像。请你将图像顺时针旋转 90 度。你必须在旋转图像，这意味着你需要直接修改输入的二维矩阵。使用另一个矩阵来旋转图像。
2025-06-26 08:52:50
1405
原创 初来乍到，我打算把博客园的文章搬家到优快云这里来
我预感到不妙，也有看过一些博客园要倒闭的帖子，我觉得可能某一天博客园会无法访问，同时我写的那些博客文章也将消失不见~~~我决定入住优快云，虽然也有些不好的评价，但是能一直写博客就可以了，想把博客园的博客搬家到这里，暂时没查到快捷方法~之前一直在博客园写博客了，有学习总结以及一些技术相关的记录，上周突然遇到访问博客园失败，提示502错误~~~
2025-06-08 11:06:58
149
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人