
React
文章平均质量分 63
天下一场夢
沉迷技术,无法自拔
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
redux 的 toolkit使用教程和demo
React 的是一个简化 Redux 开发的工具包,它提供了一系列的简化方法来处理常见的 Redux 模式。下面我将指导你如何使用创建一个简单的计数器应用。原创 2024-09-13 19:29:56 · 501 阅读 · 0 评论 -
React useCallBack用法
是 React 中的一个 Hook,它返回一个 memoized(记忆化的)回调函数。这个 Hook 主要用来优化性能,尤其是在父组件重新渲染时,避免传递新的回调函数给子组件,从而防止不必要的渲染。原创 2024-09-09 18:16:57 · 507 阅读 · 0 评论 -
React 生命周期有哪些
React 组件的生命周期可以分为几个阶段,每个阶段都有对应的生命周期方法或生命周期钩子。React 16.3 版本引入了新的生命周期方法,并且在 React 16.8 版本中引入了函数组件的 Hooks,这让生命周期的概念对于类组件和函数组件有所不同。原创 2024-09-09 16:27:37 · 478 阅读 · 0 评论 -
React diff算法原理
React 使用一种称为 “Reconciliation” 的过程来确定虚拟 DOM 树中的哪些部分发生了变化,从而最小化实际 DOM 更新的工作量。这个过程的核心是实现了一个高效的 diff 算法,通常被称为“Fiber”机制的一部分。虽然它并不完全等同于经典的 diff 算法(如 Myers’ diff algorithm 或 Hunt-McIlroy algorithm),但其目标是相似的:找出两个树结构之间的差异。原创 2024-09-09 16:26:17 · 1009 阅读 · 0 评论 -
React withRouter 作用
在React中,withRouter是库中的一个高阶组件(Higher-Order Component, HOC),它用于将 React 路由器的上下文(context)传递给那些没有直接位于组件内的组件。这样做的目的是为了让这些组件能够访问到路由器提供的属性,如matchlocation和history等。withRouter。原创 2024-09-08 21:10:25 · 665 阅读 · 0 评论 -
一文了解vue 和react框架对比
Vue 和 React 在许多方面都有相似之处,尤其是在组件化的思想、状态管理和渲染优化等方面。不过,它们在实现细节上有差异,React 更加关注于函数式编程的思想,而 Vue 则更加注重声明式的 API 设计。两者都有各自的生态系统和最佳实践,选择哪个框架/库取决于项目需求和个人偏好。原创 2024-09-07 16:42:05 · 1211 阅读 · 0 评论 -
一文了解React 的memo 、useMemo详细用法
memo用于包装函数组件,以避免在props没有变化时的重新渲染。useMemo用于缓存一个计算结果,以避免每次渲染时都重新计算,特别是在计算成本较高的情况下。正确使用memo和useMemo可以显著提高React应用的性能,尤其是在大型应用中,通过减少不必要的渲染和计算可以带来明显的性能提升。然而,过度使用这些优化也可能导致代码变得难以理解和维护,因此在使用时应谨慎评估其必要性。原创 2024-09-07 16:09:00 · 714 阅读 · 0 评论 -
react PureComponent说明和用法
是一个有用的工具,可以帮助优化应用程序的性能。然而,它也有一些限制,尤其是在处理复杂的props或state时。因此,在使用时,需要权衡性能优化和代码的可读性及可维护性。原创 2024-09-07 12:49:56 · 616 阅读 · 0 评论 -
react-router-dom Prompt组件的用法
Prompt>组件是库中的一个组件,它主要用于阻止用户在未保存更改的情况下离开当前页面或路由。当用户尝试导航到其他地方时,<Prompt>组件会弹出一个对话框询问用户是否确定要离开当前页面。<Prompt>原创 2024-09-07 10:30:16 · 581 阅读 · 0 评论 -
react useEffect用法
useEffect是一个非常灵活的 Hook,它使得函数组件能够执行各种副作用操作。通过合理配置依赖数组,你可以控制副作用函数何时执行,从而实现类似类组件生命周期方法的功能。理解并正确使用useEffect是编写高效、可维护的 React 应用程序的关键。原创 2024-09-06 18:18:51 · 667 阅读 · 0 评论 -
createAsyncThunk完整用法介绍
是 Redux Toolkit 库中的一个功能,它用于创建处理异步逻辑的 thunk action creator。Redux Toolkit 是一个官方推荐的库,用于简化 Redux 开发过程,特别是处理常见的 Redux 模式,如异步数据流。自动处理了诸如派发不同阶段的 action(如 pending、fulfilled、rejected)、取消正在运行的异步操作等功能,使得编写异步 Redux 逻辑变得更加简洁和高效。原创 2024-06-04 17:43:27 · 1442 阅读 · 0 评论 -
React useCallback用法
是 React 中的一个 Hook,它用于优化性能,通过缓存函数的引用来避免在组件的每次渲染时都创建新的函数实例。这对于避免不必要的子组件重新渲染特别有用,因为如果传递给子组件的回调函数在每次渲染时都不同,即使子组件自身没有状态变化,也会导致它们重新渲染。原创 2024-06-04 16:55:16 · 518 阅读 · 0 评论 -
React的生命周期总结
React组件的生命周期可以概述为几个关键阶段:挂载(Mounting)、更新(Updating)、卸载(Unmounting),以及错误处理。随着React的发展,特别是引入Hooks之后,经典类组件的生命周期方法逐渐被函数组件中的Effect Hooks和新的生命周期方法所替代。原创 2024-05-27 16:47:42 · 901 阅读 · 1 评论 -
craco-less 插件如何使用
craco-less是一个用于 Create React App (CRA) 的插件,它允许你在项目中无缝集成和使用 Less 作为样式预处理器。以下是如何在你的 React 项目中配置并使用craco-less。原创 2024-05-27 10:51:46 · 976 阅读 · 0 评论