夏天的味道123

React 的工作原理 React 会创建一个虚拟 DOM(virtual DOM)。当一个组件中的状态改变时，React 首先会通过 "diffing" 算法来标记虚拟 ...

Transition 使用姿势 Transition 是 react18 引入的新概念，用来区分紧急和非紧急的更新。 紧急的更新，指的是一些直接的用户交互，如输入、点击等；...

React 高阶组件、Render props、hooks 有什么区别，为什么要不断迭代 这三者是目前react解决代码复用的主要方式： 高阶组件（HOC）是 React ...

一、父组件通过 Ref 调用子组件中的方法 这里同时演示使用函数组件和类组件的父子组件如何编写 子组件 React.forwardRef React.useImperati...

React 事件机制 React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件，当事件发生并且冒泡到document处的时候，...

在单页面应用如日中天发展的过程中，备受关注的少了前端路由。 而且还经常会被xxx面试官问到，什么是前端路由，它的原理的是什么，它是怎么实现，跳转不刷新页面的... 一大堆为...

什么是 React的refs？为什么它们很重要 refs允许你直接访问DOM元素或组件实例。为了使用它们，可以向组件添加个ref属性。 如果该属性的值是一个回调函数，它将接...

前言 阅读本文章需要对 React hooks 中 useState 和 useEffect 有基础的了解。我的这篇文章内有大致介绍 在 React 项目中全量使用 Hoo...

react 强制刷新 component.forceUpdate() 一个不常用的生命周期方法, 它的作用就是强制刷新 官网解释如下 默认情况下，当组件的 state 或 ...

Redux的作用是什么 Redux的作用在于实现状态传递、状态管理。在这里你可能会说了，如果是状态传递，那我props的传递不也是可以达到这样的效果吗？context上下文...

为什么 React 元素有一个 $$typeof 属性 如果没有 $$typeof 这个属性，react 会拒绝处理该元素。 在 React 的古老版本中，下面的写法会出现...

一、props的介绍 当React遇到的元素是用户自定义的组件，它会将JSX属性作为单个对象传递给该组件，这个对象称之为“props”。 函数声明的组件，会接受一个prop...

React 组件中怎么做事件代理？它的原理是什么？ React基于Virtual DOM实现了一个SyntheticEvent层（合成事件层），定义的事件处理器会接收到一个...

前言 这篇文章循序渐进地介绍实现以下几个概念，遵循本篇文章基本就能搞懂为啥需要fiber，为啥需要commit和phases、reconciliation阶段等原理。本篇文...

了解redux吗？ redux 是一个应用数据流框架，主要解决了组件之间状态共享问题，原理是集中式管理，主要有三个核心方法：action store reduce 工作流程...

写在前面的小结 每一个 hook 函数都有对应的 hook 对象保存状态信息 useContext是唯一一个不需要添加到 hook 链表的 hook 函数 只有 useEf...

diff 虚拟DOM 比较的规则 【旧虚拟DOM】 与 【新虚拟DOM】中相同key 若虚拟DOM中的内容没有发生改变，直接使用旧的虚拟DOM 若虚拟DOM中的内容发生改变...

一、Redux是什么？ 众所周知，Redux最早运用于React框架中，是一个全局状态管理器。Redux解决了在开发过程中数据无限层层传递而引发的一系列问题，因此我们有必要...

如果一个组件有一个render属性，并且这个render属性的值为一个返回React element的函数，并且在组件内部的渲染逻辑是通过调用这个函数来完成的。那么，我们就...

Suspense 基本应用 Suspense 目前在 react 中一般配合 lazy 使用，当有一些组件需要动态加载(例如各种插件)时可以利用 lazy 方法来完成。其中...