React
文章平均质量分 81
诗渊
菜鸟飞,菜鸟飞,菜鸟高高飞
展开
-
React Hooks 介绍及与传统 class 组件的生命周期函数对比
React Hooks 介绍 及与传统 class 组件的生命周期函数对比为什么要使用 Hooks在 React 16.8 之前,函数组件也称为无状态组件,因为函数组件也不能访问 react 生命周期,也没有自己的状态。react 自 16.8 开始,引入了 Hooks 概念,使得函数组件中也可以拥有自己的状态,并且可以模拟对应的生命周期。我们应该在什么时候使用 Hooks 呢?官方并不建议我们把原有的 class 组件,大规模重构成 Hooks,而是有一个渐进过程:首先,原有的函数组件如果需要自原创 2020-11-17 16:09:02 · 3460 阅读 · 0 评论 -
React 中的 PureComponent 和 Component 对比
PureComponent的作用:PureComponent 其实是在内部帮我们简单实现了一下shouldComponentUpdate的功能,以便提供组件的性能;这里的简单指是:对prop和state做浅比较,若浅比较结果相同,则该组件以及其子组件不做render;否则,render。对比示例:// index.jsximport React, { Component } from "react";import ReactDOM from "react-dom";import './styl原创 2020-08-18 17:10:58 · 312 阅读 · 1 评论 -
React 中 setState 使用注意事项
1. 不能直接设置this.state这个基本学习过 react 的读者都不会犯这样的错,直接设置 this.state 的值并不能触发组件 render(),正确的是调用 setState() 函数来处理。2. setState() 回调函数我们在用 setState() 时,疑惑比较多的地方就是 setState() 可能不会立即生效。基于这一点,慢慢地我们就形成了 setState()...原创 2020-02-29 20:47:45 · 1175 阅读 · 0 评论 -
react新旧版本生命周期函数讲解
react在引入 Fiber 之后,其生命周期也有所变化,新增了一些生命周期函数,同时也建议使用者废弃一些生命周期函数,下面博主对比一下react v16.3之前的生命周期与react v16.4及之后的生命周期函数。一、生命周期图整体对比1.1 react v16.3之前版本挂载当组件实例被创建并插入 DOM 中时,其生命周期调用顺序如下:constructor()comp...原创 2020-02-29 15:55:01 · 1774 阅读 · 1 评论 -
react学习笔记 item9 ---双向绑定(mixin)
在 react 中要实现双向数据绑定,就得需要借助插件,LinkedStateMixin 是react 中数据双向绑定的辅助工具,利用 LinkedStateMixin 可以简化 react 中数据的双向绑定的实现。原创 2016-11-23 21:46:24 · 4451 阅读 · 0 评论 -
react学习笔记 item8 --- 表单
在 react 中,表单组件有两种类型:受限组件(约束组件)和 不受限组件(无约束组件)。本文介绍了 受限组件 和 不受限组件各自的特点,并讲解了表单中不同元素的使用方法。原创 2016-11-23 15:05:58 · 2269 阅读 · 0 评论 -
react学习笔记 item7 --- 组件的生命周期
组件的生命周期可分成三个状态:Mounted、Updating、Unmounted,本文对组件生命周期的三个状态下的所有函数进行了解析。原创 2016-11-21 21:10:37 · 849 阅读 · 0 评论 -
react学习笔记 item6 --- 事件处理
本文对 React 中的事件处理进行了介绍,通过两个示例对 React 中的事件具体使用方法进行了简单地说明,另外对 react 中的一些常用的事件进行了汇总。原创 2016-11-20 21:48:52 · 1142 阅读 · 0 评论 -
react学习笔记 item5 --- Props
本文介绍了 React 中的 props,通过 props,可以向子组件传递参数,利用getDefaultProps可以设置组件的默认 props;为了保证传递参数类型的准备性,可以借助 PropTypes 对 props 的类型进行验证。原创 2016-11-20 16:57:00 · 3938 阅读 · 0 评论 -
react学习笔记 item4 --- 状态(state)
React 把组件看成是一个状态机(State Machines)。本文介绍了react中组件的state(状态),以及常用的关于 state 的两个组件 API : setState 和replaceState 。原创 2016-11-19 21:35:26 · 3902 阅读 · 0 评论 -
react学习笔记 item3 --- 组件的创建方式
本文介绍了三种创建react 组件的方式:React.createClass、函数式组件和React.Component。通过示例介绍了三种创建方式的具体使用方法。原创 2016-11-19 15:58:13 · 1435 阅读 · 0 评论 -
react学习笔记 item2 --- JSX
本文介绍了 React 中 JSX 的使用方法,介绍了JSX 的优点,以及JSX 的一些常用的语法。原创 2016-11-18 17:51:30 · 1582 阅读 · 0 评论 -
react学习笔记 item1 --- 基础入门
React 是一个用于构建用户界面的 JAVASCRIPT 库,起源于 Facebook 的内部项目。本文对react进行了一个基本的介绍,给出了第一个简单的react示例。原创 2016-11-13 22:02:35 · 1018 阅读 · 0 评论