图解React组件生命周期

React版本更新得太快,向下兼容做得不太好,所以放慢了学习。直到最近面试才知道很多公司都开始尝试使用React了,尤其是使用React Native开发混合App。

不管是哪个版本的React,它的设计思想是没有变的,核心之一就是组件生命周期。React中状态发生转换时会触发不同的钩子函数,从而让开发者有机会做出响应。每个组件都会经历初始化、运行中和销毁三个阶段,每个阶段都有开发者可以自定义的函数,执行不同的行为。 继续阅读图解React组件生命周期

控制CSS3 动画播放、暂停、重放

CSS3动画代码相对简单,在性能上会比JavaScript动画稍微好一些,浏览器会对CSS3动画做一些优化(比如专门新建一个图层用来跑动画)。但CSS3动画对动画控制上不够灵活的缺点也很明显。如何像控制视频播放一样控制CSS3动画播放、暂停、重放呢?下面实例是我本人的一个尝试。 继续阅读控制CSS3 动画播放、暂停、重放

使用纯css制作步骤进度条

步骤进度条的使用场景很多,比如说购物流程 、订单流程、面试流程等都要用到它。网上常见的做法是使用CSS图片精灵,该做法的优点是兼容性强,但缺点也很明显:难以自适应设备,而且会加载额外的 图片资源。有没有更好一点的办法呢?下面实例将使用纯CSS来制作面试步骤进度条。 继续阅读使用纯css制作步骤进度条