React 16新特性

react 16新特性

3.1 render 新的返回类型

数组和字符串

react 16版本以前只能返回一个根元素

react 16以后版本支持返回 一个数组(Array) 或者 字符串(String)

3.2 错误处理

通过定义错误检验组件（ErrorBoundary）中使用componentDidCatch (error, info ) 生命周期函数

显示错误的元素

同时输出错误log

3.3 Portals

React 16的Portals的特性让我们可以把组件渲染到当前组件树以外的dom节点上

应用场景：渲染全局的全局弹框 使用Portals后，任意组件都可以将弹框组件渲染到根节点上，以方便弹框的显示

ReactDom.createPortals( child , container )

constructor(props){
	super(props)
	
	this.container = document.createElement('div');
	document.body.appendChild(this.container);
}

componentWillUnMount(){
	document.removeChild(this.container)
}

render(){
	return ReactDom.createPortals(
		<Modals/>
		{this.container}
	)
}

3.4 ReactDom 自定义的属性

custom-attribute

render(){
	return {
		<div custom-attribute="info">
	}
}