ReactTransitionEvents模块用于绑点或解绑animationend、transitionend事件。
'use strict'; // 检测平台如浏览器的部分能力 var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment'); // 针对浏览器兼容性获取不同的事件名,如animationend、webkitanimationend、mozanimationend、MSanimationend、oanimationend var getVendorPrefixedEventName = require('react-dom/lib/getVendorPrefixedEventName'); // 缓存当前浏览器下支持的animationend、transitionend事件名 var endEvents = []; function detectEvents() { var animEnd = getVendorPrefixedEventName('animationend'); var transEnd = getVendorPrefixedEventName('transitionend'); if (animEnd) { endEvents.push(animEnd); } if (transEnd) { endEvents.push(transEnd); } } if (ExecutionEnvironment.canUseDOM) { detectEvents(); } function addEventListener(node, eventName, eventListener) { node.addEventListener(eventName, eventListener, false); } function removeEventListener(node, eventName, eventListener) { node.removeEventListener(eventName, eventListener, false); } var ReactTransitionEvents = { // 监听animationend、transitionend事件 addEndEventListener: function (node, eventListener) { if (endEvents.length === 0) { window.setTimeout(eventListener, 0); return; } endEvents.forEach(function (endEvent) { addEventListener(node, endEvent, eventListener); }); }, // 解绑animationend、transitionend事件 removeEndEventListener: function (node, eventListener) { if (endEvents.length === 0) { return; } endEvents.forEach(function (endEvent) { removeEventListener(node, endEvent, eventListener); }); } }; module.exports = ReactTransitionEvents;