生命周期函數(shù)變化
| 函數(shù) | 操作 | 說(shuō)明 |
|---|---|---|
componentWillMountcomponentWillReceivePropscomponentWillUpdate |
16.3版本開(kāi)始警告將要棄用17.0版本開(kāi)始移除 |
增加UNSAFE_前綴可以去掉警告 |
static getDerivedStateFromProps(nextProps, prevState) |
16.3新增 | 返回值將作為state，返回空表示不需要更新state |
getSnapshotBeforeUpdate(prevProps, prevState) |
16.3新增 | 在componentDidUpdate之前可以把當(dāng)前UI的一些狀態(tài)信息暫存起來(lái) |
Context API
之前是實(shí)驗(yàn)性質(zhì)的API，現(xiàn)在轉(zhuǎn)正了。提供的功能跟redux這樣的狀態(tài)管理庫(kù)差不多。
Fragment
之前的版本中要在方法里面返回多個(gè)elements時(shí)，外面必須包一層級(jí)，例如：
render()
{
return (
<ul>
{ this.renderChilds([{name: 'Hello'}, {name: 'world'}]) }
</ul>
);
}
renderChilds(array)
{
return (
<div>
{ array.map((item, index)=><li>{ item.name }</li>) }
</div>
);
}
最終結(jié)果：
<ul>
<div>
<li>Hello</li>
<li>world</li>
</div>
</ul>
現(xiàn)在可以直接return多個(gè)elements了，不用外面包一層了，用一個(gè)虛擬的fragment即可
renderChilds(array)
{
return (
<Fragment>
{ array.map((item, index)=><li>{ item.name }</li>) }
</Fragment>
);
}
最終結(jié)果：
<ul>
<li>Hello</li>
<li>world</li>
</ul>
