女王控的博客

前端

165 篇文章

React之createRef入门学习

引言 本篇从 React Refs 的使用场景、使用方式、注意事项,到 与 Hook 的对比使用,最后以 React 源码结束,剖析整个 React Refs,关于 会在下一篇文章深入探讨。 Refs React 的核心思想是每次对于界面 state 的改动,都会重新渲染整个 Virtual DOM,然后新老的两个 Virtual DOM 树进行 diff(协调算法),对比出变化的地方,然后通过 render 渲染到实际的 UI 界面, 使用 Refs… »

React之forwardRef入门学习

forwardRef 在 中已经介绍过,有三种方式可以使用 React 元素的 ref ref 是为了获取某个节点的实例,但是函数式组件(PureComponent)是没有实例的,不存在 this 的,这种时候是拿不到函数式组件的 ref 的。 为了解决这个问题,由此引入 , 允许某些组件接收 ref,并将其向下传递给子组件 只在使用 定义组件时, 第二个参数 ref 才存在 在项目中组件库中尽量不要使用 ,因为它可能会导致子组件被 破坏性更改 函数组件 和 class… »

React之Component入门学习

组件 纯组件 和 类似,都是定义一个组件类。不同是 没有实现 ,而 通过 和 的浅比较实现了。 在下一节中将会详细介绍。 函数组件 定义 React 组件的最简单方式就是定义一个函数组件,它接受单一的 props 并返回一个 React 元素。 在函数组件中,它的输入输出全部由 props 决定,且不会产生任何副作用,这说明函数组件也是无状态组件。 在函数组件中,无法修改 props,无法使用 state… »

React之PureComponent入门学习

PureComponent 最早在 React v15.3 版本中发布,主要是为了优化 React 应用而产生。 在这段代码中, 会浅比较 或 是否改变,来决定是否重新渲染组件。 实现 和 类似,都是定义一个组件类。不同是 没有实现 ,而 通过 props 和 state 的 浅比较 实现了。 使用场景 当 的 props 和 state 均为基本类型,使用 会节省应用的性能 可能出现的问题及解决方案 当 props 或 state… »

React生命周期入门学习

React 生命周期很多人都了解,但通常我们所了解的都是 单个组件 的生命周期,但针对 Hooks 组件、多个关联组件 (父子组件和兄弟组件) 的生命周期又是怎么样的喃?你有思考和了解过吗,接下来我们将完整的了解 React 生命周期。 关于 组件 ,我们这里指的是 以及 ,但是否包括 Hooks 组件呢? Hooks 组件 函数组件 的本质是函数,没有 state 的概念的,因此 不存在生命周期 一说,仅仅是一个 render 函数 而已。 但是引入 Hooks… »

0%