如何在JavaScript和React Native中执行一段代码一段时间？

Question

我知道browser timers存在，但我从未使用它们，也不知道我需要使用哪些。 我使用的是React Native，我想要一个代码块只在10秒间隔内执行，间隔的下限应该是当第一次点击按钮时。这是我有：

<TouchableHighlight style={styles.button} 
     onPress={() => nClicks++}> 

     <Text style={styles.buttonText}> 
     Tap Here! 
     </Text> 

     </TouchableHighlight> 

的行动是完全响应，每次点击的以1为全局变量增加，我只是需要以某种方式找到一种方法来添加时间间隔约束值。有任何想法吗？

Answer 1

范围内的onPress()函数，你可能想要把setInterval()方法。你可以试试下面的代码：

var SetIntervalMixin = { 
    componentWillMount: function() { 
    this.intervals = []; 
    }, 
    setInterval: function() { 
    this.intervals.map(clearInterval); 
    this.intervals.push(setInterval.apply(null, arguments)); 
    } 
}; 

var App = React.createClass({ 
    mixins: [SetIntervalMixin], // Use the mixin 
    getInitialState: function() { 
    return { 
     seconds: 0, 
     nClicks: 0 
    }; 
    }, 
    onPress: function(plus) { 
    //this.setState({nClicks: plus}); 
    this.setInterval(this.codeToExcecute, plus * 1000); // Call a method on the mixin 
    this.setState({nClicks: this.state.nClicks + 1}); 
    }, 
    codeToExcecute: function() { 
    console.log('Im the code to excecute'); 
    }, 
    render: function() { 
    return (
     <div> 
     <p> 
      React has been running for {this.state.seconds} seconds. nClick: { this.state.nClicks } 
     </p> 
     <button onClick={ this.onPress.bind(null, this.state.nClicks + 1) }>Click</button> 
     </div> 
    ); 
    } 
}); 

React.render(
    <App />, 
    document.getElementById('example') 
); 

演示：http://jsbin.com/biyibu/2/edit