React Big Changes All in One
React Big Changes All in One
React 重大更新
React Versions
React 版本变更
semantic versioning (semver) / 语义化版本
https://reactjs.org/docs/faq-versioning.html
React 16.13.1
https://github.com/facebook/react/blob/master/CHANGELOG.md#16131-march-19-2020
React v16.13.0
https://github.com/facebook/react/blob/master/CHANGELOG.md#16130-february-26-2020
Concurrent Mode (Experimental) / 并发模式
https://reactjs.org/docs/concurrent-mode-intro.html
https://reactjs.org/docs/concurrent-mode-adoption.html
React v16.9.0
https://github.com/facebook/react/blob/master/CHANGELOG.md#1690-august-8-2019
Renaming Unsafe Lifecycle Methods
componentWillMount → UNSAFE_componentWillMount
componentWillReceiveProps → UNSAFE_componentWillReceiveProps
componentWillUpdate → UNSAFE_componentWillUpdate
https://reactjs.org/blog/2019/08/08/react-v16.9.0.html
https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html
React 16.9 does not contain breaking changes, and the old names continue to work in this release.
But you will now see a warning when using any of the old names:
why init execute twice bug
https://stackblitz.com/edit/react-ifecycle-order-all-in-one?file=package.json
https://react-ifecycle-order-all-in-one.stackblitz.io/
React v16.8
React Hooks
https://github.com/facebook/react/blob/master/CHANGELOG.md#1680-february-6-2019
useState
useReducer
useEffect
useMemo
useCallback
https://reactjs.org/docs/hooks-intro.html
import React, { useState } from 'react';
function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
React v16.3.0
https://github.com/facebook/react/blob/master/CHANGELOG.md#1630-march-29-2018
React lifecycle
getDerivedStateFromProps()
getSnapshotBeforeUpdate()
React DOM
supported context API
React.createRef()
React.forwardRef()
https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#migrating-from-legacy-lifecycles
React v16.x.x
refs
JSX Transform
React 17 doesn’t contain new features, it will provide support for a new version of the JSX transform.
https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
React Big Changes All in One的更多相关文章
- react组件的生命周期
写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...
- 十分钟介绍mobx与react
原文地址:https://mobxjs.github.io/mobx/getting-started.html 写在前面:本人英语水平有限,主要是写给自己看的,若有哪位同学看到了有问题的地方,请为我指 ...
- RxJS + Redux + React = Amazing!(译一)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...
- React 入门教程
React 起源于Facebook内部项目,是一个用来构建用户界面的 javascript 库,相当于MVC架构中的V层框架,与市面上其他框架不同的是,React 把每一个组件当成了一个状态机,组件内 ...
- 通往全栈工程师的捷径 —— react
腾讯Bugly特约作者: 左明 首先,我们来看看 React 在世界范围的热度趋势,下图是关键词“房价”和 “React” 在 Google Trends 上的搜索量对比,蓝色的是 React,红色的 ...
- 2017-1-5 天气雨 React 学习笔记
官方example 中basic-click-counter <script type="text/babel"> var Counter = React.create ...
- RxJS + Redux + React = Amazing!(译二)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...
- React在开发中的常用结构以及功能详解
一.React什么算法,什么虚拟DOM,什么核心内容网上一大堆,请自行google. 但是能把算法说清楚,虚拟DOM说清楚的聊聊无几.对开发又没卵用,还不如来点干货看看咋用. 二.结构如下: impo ...
- React的使用与JSX的转换
前置技能:Chrome浏览器 一.拿糖:React的使用 React v0.14 RC 发布,主要更新项目: 两个包: React 和 React DOM DOM node refs 无状态的功能 ...
- Vue.js 2.0 和 React、Augular等其他框架的全方位对比
引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...
随机推荐
- 作为一款内存数据库,为什么断电后Redis数据不会丢失
前言 Redis 作为一款内存数据库,被广泛使用于缓存,分布式锁等场景,那么假如断电或者因其他因素导致 Reids 服务宕机,在重启之后数据会丢失吗? Redis 持久化机制 Redis 虽然是定义为 ...
- 常用shell命令及其用法
ls(lsit) 1.作用:列出文件列表 2.用法:ls [-a|-A--] [filename|directory] ls ls -a:查看隐藏文件 ls -l:查看文件详细信息 ...
- ubuntu中如何安装selenium+chrome(headless)无界面浏览器?
selenium是一个Web的自动化测试工具,它可以根据我们的指令,让浏览器自动加载页面,获取需要的数据,甚至页面截屏,或者判断网站上某些动作是否发生.但是它自身不带浏览器,不支持浏览器的功能,因此它 ...
- 基于Koa2框架的项目搭建及实战开发
Koa是基于 Node.js 平台的下一代 web 开发框架,由express原班人马打造,致力于成为一个更小.更富有表现力.更健壮的 Web 框架.使用 koa 编写 web 应用,通过组合不同的 ...
- oracle 常用语法()
一ORACLE的启动和关闭 1在单机环境下 2在双机环境下 Oracle数据库有哪几种启动方式 1startup nomount 2startup mount dbname 3startup open ...
- java生成Https证书,及证书导入的步骤和过程
以下是相关的Tomcat,JDK和Windows环境: Tomcat版本:tomcat-7.0.55 JDK版本: jdk1.6.0 目录所在的位置: Serve的目录:D:\server\tomca ...
- 深信服edr控制中心漏洞——代码执行
第一处代码执行 文件:tool/php_cli.php第64行
- 使用mybatis自动实现接口封装返回结果集
import java.lang.annotation.Annotation; import java.lang.annotation.Documented; import java.lang.ann ...
- 存储过程demo返回银行名称
create or replace procedure TEST_NUMO(Cityno IN VARCHAR2,--输入参数 Deptid IN VARCHAR2,--输入参数 Retval OUT ...
- 关于Java注解(annotation)的简单理解
一.什么是注解? 从 JDK5 开始,Java增加对元数据的支持,也就是注解.简单理解就是代码里的特殊标志,这些标志可以在编译,类加载,运行时被读取,并执行相应的处理,以便于其他工具补充信息或者进行部 ...