![](https://img-blog.csdnimg.cn/2020040315454141.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
React
React
_Boboy
一线 Github 搬运工,为 API 生,为 框架 死,为 debug 奋斗一辈子。对,就是这样。工作之余简单写一写。
展开
-
react 如何渲染富文本内容
import React, { Component } from 'react'; class App extends Component { constructor(){ super() this.state={ article:"<div>我是富文本内容</div>", } } render() { return ( <div dangerouslySetInnerHTML={{__html:thi原创 2021-02-04 14:05:32 · 8760 阅读 · 0 评论 -
React Component生命周期
在学习vue时候有生命周期的认知,其实react一样也有生命周期。 React的生命周期组件分三个阶段:Mounting(加载阶段)Updating(更新阶段)Unmounting(卸载阶段)旧生命周期版本更新我们先看下之前旧的生命周期以一个例子为例import React, { Component } from 'react'class LifeCycleSon ex...原创 2020-03-16 16:38:35 · 329 阅读 · 0 评论 -
React memo介绍与使用
前言介绍之前可以了解下shouldComponentUpdate,React PureComponent。React.memo介绍React.memo 为高阶组件。它与 React.PureComponent 非常相似,但它适用于函数组件,但不适用于 class 组件。如果你的函数组件在给定相同 props 的情况下渲染相同的结果,那么你可以通过将其包装在 React.memo 中调用,以...原创 2020-03-18 13:59:10 · 26779 阅读 · 0 评论 -
React PureComponent介绍与使用
前言介绍之前可以先看下shouldComponentUpdate介绍PureComponent介绍React15.3中新加了一个 PureComponent 类,顾名思义, pure 是纯的意思, PureComponent 也就是纯组件,取代其前身 PureRenderMixin , PureComponent 是优化 React 应用程序最重要的方法之一,易于实施,只要把继承类从 Com...原创 2020-03-18 11:56:07 · 6089 阅读 · 0 评论 -
React生命周期shouldComponentUpdate介绍及性能优化
React生命周期shouldComponentUpdate介绍及性能优化在react开发中,经常需要对数据state状态进行改变,但是这种方式每当setState的时候都会将所有的组件重新渲染一遍,这样就会有重复渲染render的问题。看如下图组件树:默认情况下,当执行setState()方法时,react 会重新渲染整个组件树,这造成不必要的性能开销。黄色的节点表示我们修改了数据的节点...原创 2020-03-16 18:30:36 · 6098 阅读 · 1 评论 -
React Fragment介绍与使用
前言在向 DOM 树批量添加元素时,一个好的实践是创建一个document.createDocumentFragment,先将元素批量添加到DocumentFragment 上,再把 DocumentFragment 添加到 DOM 树,减少了 DOM操作次数的同时也不会创建一个新元素。和 DocumentFragment 类似,React 也存在 Fragment 的概念,用途很类似...原创 2020-03-18 14:41:13 · 27242 阅读 · 0 评论 -
React.Component API Error Boundaries
一、描述错误边界 是 React 的一种组件树,能够在子组件树中的任何位置捕获 JavaScript 错误,并且能够打日志或者是显示错误情况下的UI组件。错误边界能够在渲染期间、生命周期方法以及它们下面的整个树的构造函数中捕获错误。如果一个类组件定义了下面生命周期方法中的任何一个或者是两个,则这个类组件将成为一个错误边界:static getDerivedStateFromError()componentDidCatch()从上面的生命周期方法中可以捕获未处理的 javascript 错误,转载 2020-06-01 10:46:44 · 221 阅读 · 0 评论