React 版本更新记录
v16.3
v16.2
新增
Fragment
提高了对子组件的渲染方法返回多个子元素的支持
官方文档 Fragmentrender() { return ( <> <ChildA /> <ChildB /> <ChildC /> </> ); }
componentWillMount /
componentWillUpdate / componentWillReceiveProps`废弃倒计时新增静态方法
getDerivedStateFromProps
替代componentWillReceiveProps
它会生成一个新
state
,方便让你setState
。所有生命周期钩子(除了构造器)的context
传参都被无效了新增
createContext()
它会返回一个具有
Provider
和Consumer
方法的对象严格模式
StrictMode
严格模式确保你的代码遵循最佳实践 就像原生 js 的use strict
render(){ return ( <StrictMode> <Context.Provider> <Title/> </Context.Provider> </StrictMode> ) }
异步组件
AsyncMode
尚未全面支持
v16.0 变动
新核心架构
Fiber
React.PropTypes
废弃使用
prop-types
库代替React.createClass
废弃官方推荐使用 ES6
class
方式创建组件render
可返回数组 或 字符串render() { return [ <div key='1'>1</div>, <div key='2'>2</div>, <div key='3'>3</div>, ]; } // 注:不要忘了加key // 也可以直接返回字符串 render() { return 'Hello World'; }
新的生命周期
componentDidCatch
错误处理机制,如同
try…catch
可以用于捕获子组件的错误,即使子组件有代码报错,也不至于导致整个 APP 崩溃接受元素上的自定义属性
<p abc="123"> // 以前react会忽略abc属性(因为p元素没有abc这个属性),并在控制台抛出一个错误 // 现在会正确的把abc赋加在p标签上 </p>
新增
ReactDOM.createPortal
方法以前一个组件只能被默认的渲染到父级所引用它的地方,
createPortal 方法可以把组件自身的内容渲染到任意一个指定的 dom 元素下
但事件的冒泡仍然会从它原本的父级传递
官方文档:Portals其他
服务端渲染优化,比以前更好
react
和react-dom
库文件大小比以前更小
react 开源协议为MIT
协议
本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!