[ReactNative] Use oss TimerMixin
This commit is contained in:
parent
fe0527a7c4
commit
57ee9e7dc0
|
@ -18,9 +18,9 @@ var {
|
|||
StyleSheet,
|
||||
Text,
|
||||
TextInput,
|
||||
TimerMixin,
|
||||
View,
|
||||
} = React;
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
var MovieCell = require('./MovieCell');
|
||||
var MovieScreen = require('./MovieScreen');
|
||||
|
|
|
@ -14,9 +14,9 @@ var React = require('react-native');
|
|||
var {
|
||||
ActivityIndicatorIOS,
|
||||
StyleSheet,
|
||||
TimerMixin,
|
||||
View,
|
||||
} = React;
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
var ToggleAnimatingActivityIndicator = React.createClass({
|
||||
mixins: [TimerMixin],
|
||||
|
|
|
@ -15,10 +15,10 @@ var {
|
|||
AlertIOS,
|
||||
StyleSheet,
|
||||
Text,
|
||||
TimerMixin,
|
||||
TouchableHighlight,
|
||||
View,
|
||||
} = React;
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
var Button = React.createClass({
|
||||
render: function() {
|
||||
|
|
|
@ -13,9 +13,9 @@ var React = require('react-native');
|
|||
var {
|
||||
StyleSheet,
|
||||
Text,
|
||||
TimerMixin,
|
||||
View,
|
||||
} = React;
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
var TimersTest = React.createClass({
|
||||
mixins: [TimerMixin],
|
||||
|
|
|
@ -21,7 +21,7 @@ var ReactIOSViewAttributes = require('ReactIOSViewAttributes');
|
|||
var StyleSheet = require('StyleSheet');
|
||||
var Text = require('Text');
|
||||
var TextInputState = require('TextInputState');
|
||||
var TimerMixin = require('TimerMixin');
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
var TouchableWithoutFeedback = require('TouchableWithoutFeedback');
|
||||
|
||||
var createReactIOSNativeComponentClass = require('createReactIOSNativeComponentClass');
|
||||
|
|
|
@ -14,7 +14,7 @@ var NativeMethodsMixin = require('NativeMethodsMixin');
|
|||
var React = require('React');
|
||||
var ReactIOSViewAttributes = require('ReactIOSViewAttributes');
|
||||
var StyleSheet = require('StyleSheet');
|
||||
var TimerMixin = require('TimerMixin');
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
var Touchable = require('Touchable');
|
||||
var TouchableWithoutFeedback = require('TouchableWithoutFeedback');
|
||||
var View = require('View');
|
||||
|
|
|
@ -16,7 +16,7 @@ var RCTUIManager = require('NativeModules').UIManager;
|
|||
var ScrollView = require('ScrollView');
|
||||
var ScrollResponder = require('ScrollResponder');
|
||||
var StaticRenderer = require('StaticRenderer');
|
||||
var TimerMixin = require('TimerMixin');
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
var logError = require('logError');
|
||||
var merge = require('merge');
|
||||
|
|
|
@ -1,109 +0,0 @@
|
|||
/**
|
||||
* Copyright (c) 2015-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*
|
||||
* @providesModule TimerMixin
|
||||
* @flow
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
var setImmediate = require('setImmediate');
|
||||
var clearImmediate = require('clearImmediate');
|
||||
|
||||
/**
|
||||
* Using bare setTimeout, setInterval, setImmediate and
|
||||
* requestAnimationFrame calls is very dangerous because if you forget to cancel
|
||||
* the request before the component is unmounted, you risk the callback throwing
|
||||
* an exception.
|
||||
*
|
||||
* If you include TimerMixin, then you can replace your calls
|
||||
* to `setTimeout(fn, 500)`
|
||||
* with `this.setTimeout(fn, 500)` (just prepend `this.`)
|
||||
* and everything will be properly cleaned up for you.
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* var Component = React.createClass({
|
||||
* mixins: [TimerMixin],
|
||||
* componentDidMount: function() {
|
||||
* this.setTimeout(
|
||||
* () => { console.log('I do not leak!'); },
|
||||
* 500
|
||||
* );
|
||||
* }
|
||||
* });
|
||||
*/
|
||||
|
||||
var setter = function(setter, clearer, array) {
|
||||
return function(
|
||||
callback: () => void,
|
||||
delta: number
|
||||
): number {
|
||||
var id = setter(() => {
|
||||
clearer.call(this, id);
|
||||
callback.apply(this, arguments);
|
||||
}, delta);
|
||||
|
||||
if (!this[array]) {
|
||||
this[array] = [id];
|
||||
} else {
|
||||
this[array].push(id);
|
||||
}
|
||||
return id;
|
||||
};
|
||||
};
|
||||
|
||||
var clearer = function(clearer, array) {
|
||||
return function(id: number) {
|
||||
if (this[array]) {
|
||||
var index = this[array].indexOf(id);
|
||||
if (index !== -1) {
|
||||
this[array].splice(index, 1);
|
||||
}
|
||||
}
|
||||
clearer(id);
|
||||
};
|
||||
};
|
||||
|
||||
var _timeouts = 'TimerMixin_timeouts';
|
||||
var _clearTimeout = clearer(clearTimeout, _timeouts);
|
||||
var _setTimeout = setter(setTimeout, _clearTimeout, _timeouts);
|
||||
|
||||
var _intervals = 'TimerMixin_intervals';
|
||||
var _clearInterval = clearer(clearInterval, _intervals);
|
||||
var _setInterval = setter(setInterval, () => {/* noop */}, _intervals);
|
||||
|
||||
var _immediates = 'TimerMixin_immediates';
|
||||
var _clearImmediate = clearer(clearImmediate, _immediates);
|
||||
var _setImmediate = setter(setImmediate, _clearImmediate, _immediates);
|
||||
|
||||
var _rafs = 'TimerMixin_rafs';
|
||||
var _cancelAnimationFrame = clearer(window.cancelAnimationFrame, _rafs);
|
||||
var _requestAnimationFrame = setter(window.requestAnimationFrame, _cancelAnimationFrame, _rafs);
|
||||
|
||||
var TimerMixin = {
|
||||
componentWillUnmount: function() {
|
||||
this[_timeouts] && this[_timeouts].forEach(this.clearTimeout);
|
||||
this[_intervals] && this[_intervals].forEach(this.clearInterval);
|
||||
this[_immediates] && this[_immediates].forEach(this.clearImmediate);
|
||||
this[_rafs] && this[_rafs].forEach(this.cancelAnimationFrame);
|
||||
},
|
||||
|
||||
setTimeout: _setTimeout,
|
||||
clearTimeout: _clearTimeout,
|
||||
|
||||
setInterval: _setInterval,
|
||||
clearInterval: _clearInterval,
|
||||
|
||||
setImmediate: _setImmediate,
|
||||
clearImmediate: _clearImmediate,
|
||||
|
||||
requestAnimationFrame: _requestAnimationFrame,
|
||||
cancelAnimationFrame: _cancelAnimationFrame,
|
||||
};
|
||||
|
||||
module.exports = TimerMixin;
|
|
@ -54,7 +54,6 @@ var ReactNative = Object.assign(Object.create(require('React')), {
|
|||
PanResponder: require('PanResponder'),
|
||||
StatusBarIOS: require('StatusBarIOS'),
|
||||
StyleSheet: require('StyleSheet'),
|
||||
TimerMixin: require('TimerMixin'),
|
||||
VibrationIOS: require('VibrationIOS'),
|
||||
|
||||
// Plugins
|
||||
|
|
|
@ -30,9 +30,10 @@
|
|||
"dependencies": {
|
||||
"connect": "2.8.3",
|
||||
"jstransform": "10.0.1",
|
||||
"react-timer-mixin": "^0.13.1",
|
||||
"react-tools": "0.13.0-rc2",
|
||||
"source-map": "0.1.31",
|
||||
"stacktrace-parser": "0.1.1",
|
||||
"react-tools": "0.13.0-rc2"
|
||||
"stacktrace-parser": "0.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"ws": "0.4.31",
|
||||
|
|
Loading…
Reference in New Issue