React Big Changes All in One

React Big Changes All in One

React 重大更新

React Versions

React 版本变更

https://reactjs.org/versions/

semantic versioning (semver) / 语义化版本

https://semver.org/

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

https://reactjs.org/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.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 发布文章使用：只允许注册用户才可以访问！

---