React 16 新特性_react16是什么时候发布的?-程序员宅基地

技术标签: react  

2017年9月26日React 16发布,通过官网和示例了解一下新特性。

React 16更新

新js环境要求

react16依靠Map和Set集合和requestAnimationFrame(一个针对动画效果的API)

新功能

- Fragments:render函数可以返回数组和字符串
- error boundaries:错误处理
- portals :支持声明性地将子树渲染到另一个DOM节点
- custom DOM attributes :ReactDom允许传递非标准属性
- improved server-side rendering:提升服务端渲染性能
  1. Fragments

    render() {
      return [
        <li key="A"/>First item</li>,
        <li key="B"/>Second item</li>,
        <li key="C"/>Third item</li>,
      ];
    }
    

    详见API

  2. error boundaries

    之前,一旦某个组件发生错误,整个组件树将会从根节点被unmount下来。React 16修复了这一点,引入了Error Boundary的概念,中文译为“错误边界”,当某个组件发生错误时,我们可以通过Error Boundary捕获到错误并对错误做优雅处理,如使用Error Boundary提供的内容替代错误组件。Error Boundary可以看作是一种特殊的React组件,新增了componentDidCatch这个生命周期函数,它可以捕获自身及子树上的错误并对错误做优雅处理,包括上报错误日志、展示出错提示,而不是卸载整个组件树。(注:它并不能捕获runtime所有的错误,比如组件回调事件里的错误,可以把它想象成传统的try-catch语句)

    实践:

    抽象出检查错误边界公共组件:

    class ErrorBoundary extends React.Component{
        constructor(props){
            super(props);
            this.state=({
                ifError:false
            });
        }
    
        componentDidCatch(err, info) {
            this.se
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/xcg132566/article/details/78836306

智能推荐

stm32入门笔记(一)工程的建立和使用以及常见的头文件库函数找不到问题的解决_stm32搜索不到函数-程序员宅基地

文章浏览阅读1.9k次。一个完整的工程结构这是一个完整的工程目录,当然需要注意的几点1.头文件找不到:解决方法-------------在编译设置------c/c++----includepath里面加入你的头文件的路径2.c文件加进来之后没有h文件-----------------解决方法:将新的文件编译3.上面的都做完了,找不到库函数-----------------解决方法:在fwli..._stm32搜索不到函数

maven build src/main/java目录下的xml等资源文件不被打包_java .dtd文件不被打包-程序员宅基地

文章浏览阅读4.3k次。解决方法:pom.xml设置resource src/main/resources **/*.properties **/*.xml **/*.tld false src/main/java **/*.properties **/*.xml **_java .dtd文件不被打包

linux用户空间使用pwm,详解linux pwm驱动编写-程序员宅基地

文章浏览阅读683次。pwm方波可以用来控制很多的设备,比如它可以被用来控制电机。简单来说,就是单位时间内的方波越多,那么电机的转速就会越快;反之就越慢。通过这个特性,soc就可以轻松地利用pwm对外设进行自动控制。所以,今天的主题就是pwm驱动。1、驱动目录drivers/pwm2、查看对应目录下的Kconfigconfig PWM_SAMSUNGtristate "Samsung PWM support"depen..._linux pwm用户态程序

Java中类、继承、接口、异常练习题_/* 请在下面的【】处补充代码 */ //测试类 public class buildingtest-程序员宅基地

文章浏览阅读449次。注意:按Java规范书写程序代码,如果你认为程序有错误,请指出,并说明程序错误原因。1.编译会成功吗?class Demo{ public static void func() { try { throw new Exception(); } finally { System.out.println("B"); } } public static void main(String[] args) { tr_/* 请在下面的【】处补充代码 */ //测试类 public class buildingtest { publ

UNIX操作系统发展史简介_unix发展史-程序员宅基地

文章浏览阅读5.6k次,点赞6次,收藏12次。本文来自https://mp.weixin.qq.com/s/GgXAGj0Kbo1gKPT4D4WYSA1964年贝尔实验室(Bell Labs)、通用电气(General Electric)和麻省理工学院(MIT)联合启动研发第二代分时操作系统MULTICS(Multiplexed Information and Computing Service)(注:MULTICS正式研制始于1965年)1969年,贝尔实验室研究人员Ken Thompson在退出MULTICS项目时,准备将原本在MULT._unix发展史

计算机通信基础及协议_计算机会问计算机的表现形式等,通信会问通信工程的协议有哪些等等-程序员宅基地

文章浏览阅读3.3k次。系列文章目录提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加例如:第一章 Python 机器学习入门之pandas的使用提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录系列文章目录 前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的_计算机会问计算机的表现形式等,通信会问通信工程的协议有哪些等等

随便推点

Eclipse上使用arm-xilinx-linux-gnueabi-gcc遇到的The selection cannot be launched的问题_c语言the selection cannot be launched-程序员宅基地

文章浏览阅读1.2k次。想通过Eclipse来开发在ZedBoard上运行的C程序,于是新建了个C工程(需先安装CDT),在工程Properties -> C/C++ Build -> Settings中,将gcc换成交叉编译器后,点OK。(注意:一定要把交叉编译器的完整路径加上,不然Eclipse找不到编译器在哪,哪怕已经设置过环境变量。必要时,需要对root文件夹来一句chmod 777,否则会出现权_c语言the selection cannot be launched

fpga_pwm呼吸灯(EP4CE6F17C8)_硬木课堂ep4ce6f17c8开发板-程序员宅基地

文章浏览阅读2.3k次。呼吸灯是指灯光在微电脑的控制之下完成由亮到暗的逐渐变化,使用开发板上的四个led灯实现1s间隔的呼吸灯。_硬木课堂ep4ce6f17c8开发板

Deconvolution 反卷积 & Transposed Convolution 转置卷积 & Fractionally Strided Convolution_strided conv: transposed conv:-程序员宅基地

文章浏览阅读473次,点赞2次,收藏4次。看DCGAN时,看到了deconvolution,概念总混淆,记录一下Transposed convolutional layers (also known as fractionally strided convolutional layers, or – wrongly – as deconvolutions)下面这些文章很有帮助:http://deeplearning.net/software/theano_versions/dev/tutorial/conv_arithmetic.html#t_strided conv: transposed conv:

使用 Python 生成二维码_python生成二维码-程序员宅基地

文章浏览阅读3.4w次,点赞48次,收藏411次。使用 Python 生成二维码。现在二维码应用随处可见,生活中二维码可以说是无处不在了:加好友,付钱,扫个码。python生成二维码非常方便。本文就来讲解如何用python开发生成二维码。_python生成二维码

SSL在tomcat上的配置,nginx上的简单配置。及其注意事项-程序员宅基地

文章浏览阅读3.9k次。本文偏重于证书申请、下载、tomcat中的配置。nginx配置为简化版,详细配置、高级定制配置见我另一篇博客。

SSM报ested exception is org.apache.ibatis.binding.BindingException: Parameter '0' not found.-程序员宅基地

文章浏览阅读1.6k次。错误原因,:在mybatis3.4.4版不能直接使用#{0}要使用#{arg0},old:SELECT count(id) FROM `hotel` where count=#{0} and pwd=#{1};改为new:SELECT count(id) FROM `hotel` where count=#{arg0} and pwd=#{arg1}; ..._ested exception is org.apache.ibatis.binding.bindingexception: parameter 'qo